drawerContent.vue

<template lang="html">
  <ScrollView>
    <StackLayout width="100%">
      <Label
        v-for="(page, i) in pages"
        @tap="goToPage(page.component)"
        verticalAlignment="center"
        width="95%"
        height="50"
        color="#000000"
        :text="page.name"
        borderBottomWidth="2px"
        borderBottomColor="#2e2e2e"
        :key="i"
      />
    </StackLayout>
  </ScrollView>
</template>

<script>
import sideDrawer from '~/mixins/sideDrawer'
export default {
  mixins: [sideDrawer],
  data () {
    // define our pages, making sure the component matches that defined in /app/router/index.js
    pages: [
      { name: 'Home', component: this.$routes.Home },
      { name: 'Page One', component: this.$routes.PageOne },
      { name: 'Page Two', component: this.$routes.PageTwo }
    ]
  },
  methods: {
    goToPage (pageComponent) {
      // use the manual navigation method
      this.$navigateTo(pageComponent)
      // and we probably want to close the drawer when changing pages
      this.closeDrawer()
    }
  }
}
</script>

<style lang="css">
</style>