Passing state inside v-ons-navigator page



  • Hello,

    I’m having some difficulties to pass the initial state to the page of ons-navigator. I have a list of expenses and when the user clicks (or taps) an expense item I want to show an edit page stacked with the expense data.

    //Expenses.vue
    <template>
    <v-ons-list-item tappable v-for="e in expenses" @click="editExpense(e)">
    // item contents omitted
    </v-ons-list-item>
    </template>
    <script>
    //...
    methods: {
      editExpense(expense) {
        var expView = new ExpenseView({ 
          propsData: { expense: expense } //!!! It don't work !!!
        }) 
        this.$bus.$emit('push-page', expView)
      }
    }
    //...
    </script>
    
    //App.vue
    <template>
      <div id="app">
        <v-ons-navigator swipeable :page-stack="pageStack"></v-ons-navigator>
      </div>
    </template>
    
    <script>
    mounted: function(){
      this.$bus.$on('push-page', (page, expense)=>{
        this.pageStack.push(page)
      });
    </script>
    }
    

    I know that there is a way to do that but I can’t figure out. Anyone can help me?


Log in to reply