Navigation

    Monaca & Onsen UI
    • Login
    • Search
    • Tags
    • Users
    • Blog
    • Playground
    1. Home
    2. mejuliver
    • Flag Profile
    • Profile
    • Following
    • Followers
    • Blocks
    • Topics
    • Posts
    • Best
    • Groups
    Save
    Saving

    mejuliver

    @mejuliver

    0
    Reputation
    3
    Posts
    372
    Profile views
    0
    Followers
    0
    Following
    Joined Last Online

    mejuliver Follow

    Posts made by mejuliver

    • Social Sharing, social authentication

      Any recommended social sharing, social authentication plugin for cordova? I’m using Onsen + Vue + Cordova but no luck, I’m unable to find any good plugin, tried this social sharing plugin

      cordova plugin add cordova-plugin-x-socialsharing
      cordova prepare
      

      then on onsen actionsheet, on action button click

      methods : {
              shareto(){
                  const _self = this;
                  if( type == 'fb' ){
                                  window.plugins.socialsharing.shareViaFacebook(
                                      '<p>test</p>',
                                      this.listdata.logo_source,
                                      this.listdata.url,
                                      function(){
                                         alert('Success');
                                      },
                                      function(errormsg){
                                          alert(errormsg);  
                                      }
                                  );
                              }
                  this.actionSheetVisible = false;
              },
      }
      

      then did npm run build, copy the distribution files to cordova www folder
      did cordova platform add android
      did cordova emulate android

      and this what It throws from catching the error on function(errormsg){ after trigger the share to facebook action button

      com.google.android.apps.photos,com.android.messaging,com.google.android.gm

      any help, ideas please?

      posted in Monaca Tools
      mejuliver
    • vuejs onsen app using both splitter and push page navigator, push page not working

      I’m trying to create an onsen app using vuejs but I’m stuck on push page navigator where only splitter is working, push page is not working. below is what I’ve tried. (I’m using vue cli)

      files structure
      
      src
          - components
              - Home.vue
              - Main.vue
              - Swipenav.vue
              - Toolbar.vue
      
          - App.vue
          - main.js
      

      Swipenav.vue

      <template>
          <v-ons-navigator swipeable :page-stack="pageStack" @push-page="pageStack.push($event)">
              <v-ons-page>
                  <v-ons-splitter>
                      <v-ons-splitter-side swipeable
                          width="150px" collapse="" side="left"
                      :open.sync="openSide"
                      >
                          <v-ons-page>
                              <v-ons-list>
                                  <v-ons-list-item v-for="page in pages" :key="page.id" tappable modifier="chevron" @click="currentPage = page.name; openSide = false"
                                  >
                                      <div class="center">{{ page.title }}</div>
                                  </v-ons-list-item>
                              </v-ons-list>
                          </v-ons-page>
                      </v-ons-splitter-side>
      
                      <v-ons-splitter-content>
                          <component :is="currentPage" :toggle-menu="() => openSide = !openSide"></component>
                      </v-ons-splitter-content>
      
                  </v-ons-splitter>
              </v-ons-page>
          </v-ons-navigator>
      </template>
      
      
      <script>
      import main_tpl from './Main.vue'
      import home_tpl from './Home.vue'
      export default {
          name : "swipenav",
          data() {
              return {
                  pageStack: [main_tpl],
                  pages : [
                      { name : 'main_tpl', title : 'Main' },
                      { name : 'home_tpl', title : 'Home' },
                  ],
                  currentPage : 'home_tpl',
                  openSide : false
              };
          },
          components : {
              home_tpl : home_tpl,
              main_tpl : main_tpl
          }
      }
      </script>
      

      Main.vue

      <template>
        <v-ons-page>
          <v-ons-toolbar>
            <div class="center">Main</div>
          </v-ons-toolbar>
          <p style="text-align: center">
            main page
            <v-ons-button @click="push_signin">Push signin</v-ons-button>
          </p>
        </v-ons-page>
      </template>
      
      <script>
      import signin_tpl from './Signin.vue';
      export default {
        name : 'mainpage_comp',
        methods : {
          push_signin(){
            console.log('working');
            this.$emit('push-page',signin_tpl)
          }
        }
      }
      </script>
      

      I can confirm this push_signin() method is working but seems this.$emit(‘push-page’,signin_tpl) is not working. Any help, ideas please?

      posted in Onsen UI
      mejuliver
    • UI navigator pageStack + template with splitter

      I’m stuck with pushPage where the reference template contains of splitter component. Here’s the link of my snippets

      Surely I can use

      this.$emit('push-page', appHome_tpl);
      

      but seems the animation is buggy. Any help, ideas please?

      posted in Onsen UI
      mejuliver