使用vuetify添加抽屉

时间:2019-08-16 18:31:04

标签: vuetify.js

我正在尝试使用vuetify。.我需要在我的工具栏中添加抽屉,但是不幸的是,它没有用,代码中有什么问题

在这里您将找到Navbar.vue

<template>
    <nav>
        <v-toolbar flat app>
            <v-toolbar-side-icon></v-toolbar-side-icon>
            <v-toolbar-title class="text-uppercase grey--text">
                <span class="font-weight-light">SysLog</span>
            </v-toolbar-title>
            <v-spacer></v-spacer>
            <v-btn >
                <span>Sign Out</span>
                <v-icon right>mdi-exit-to-app</v-icon>
            </v-btn>
        </v-toolbar>

        <v-navigation-drawer v-model="drawer" app class="indigo">
            <p>Logging</p>
        </v-navigation-drawer>

    </nav>
</template>

<script>
export default {
    data() {
        return {
            drawer: true
        }
    }

}
</script>

在这里您将找到App.vue

<template>
  <v-app class="grey lighten-4">
    <Navbar />
    <v-content>
      <router-View></router-View>
    </v-content>
  </v-app>
</template>

<script>
//Any components need to add here 
import Navbar from '@/components/Navbar'
export default {
  name: 'App',
  //Any components need to add here also
  components:{ Navbar },

  data: () => ({
    //
  }),
};
</script>

关于此代码的任何建议,我将不胜感激..预先感谢

0 个答案:

没有答案