Sub-Store/web/src/components/TopToolbar.vue
Peng-YM 8b4c972f77 适配移动端web app
样式来自Chavyleung
2020-08-26 21:33:00 +08:00

67 lines
1.3 KiB
Vue

<template>
<div>
<v-navigation-drawer
app
fixed
v-model="showMenu"
>
<v-list dense>
<v-list-item @click="doNothing">
<v-list-item-action>
<v-icon>settings</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>Settings</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item @click="doNothing">
<v-list-item-action>
<v-icon>help</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>Help</v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
</v-navigation-drawer>
<v-app-bar
app
color="primary"
dark
fixed
>
<v-app-bar-nav-icon @click.stop="toggleMenu"></v-app-bar-nav-icon>
<v-toolbar-title>{{title}}</v-toolbar-title>
</v-app-bar>
</div>
</template>
<script>
export default {
data: () => {
return {
showMenu: false
}
},
methods: {
toggleMenu: function () {
this.showMenu = !this.showMenu;
},
doNothing: function () {
}
},
computed: {
title: function () {
return this.$store.state.title;
}
}
}
</script>