Skip to content

Instantly share code, notes, and snippets.

@JamieCurnow
Created October 16, 2018 01:19
Show Gist options
  • Save JamieCurnow/8f834e1bcb7182415321c6f39d66eff1 to your computer and use it in GitHub Desktop.
Save JamieCurnow/8f834e1bcb7182415321c6f39d66eff1 to your computer and use it in GitHub Desktop.
<template lang="html">
<ScrollView>
<StackLayout width="100%">
<Label class="drawer-header" text="Drawer"/>
<Label
v-for="(page, i) in pages"
@tap="goToPage(page.component)"
class="drawer-item"
:text="page.name"
:key="i"
/>
<Button class="drawer-close-button" @tap="closeDrawer()">Close Drawer</Button>
</StackLayout>
</ScrollView>
</template>
<script>
import sideDrawer from '~/mixins/sideDrawer'
export default {
mixins: [sideDrawer],
data () {
return {
// 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>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment