<v-menu :nudge-width="140" :nudge-bottom="28">
<template v-slot:activator="{ on, attrs }">
<v-btn text v-bind="attrs" v-on="on" color="#444">
<v-app-bar-nav-icon class="menu"></v-app-bar-nav-icon>
</v-btn>
</template>
<v-sheet class="overflow-hidden">
<v-list dense expand nav>
<v-list-item to="/user/home">
<v-list-item-title class="d-flex align-center justify-center">
<v-icon class="mr-2">mdi-account</v-icon>
个人中心
</v-list-item-title>
</v-list-item>
<v-list-item @click="logout()">
<v-list-item-title class="d-flex align-center justify-center">
<v-icon class="mr-2">mdi-logout</v-icon>
退出登录
</v-list-item-title>
</v-list-item>
</v-list>
</v-sheet>
</v-menu>
<style lang="less" scoped>
.v-menu__content--fixed {
left: auto !important;
right: 0 !important;
}
</style>
Vuetify—— v-menu样式
最新推荐文章于 2024-05-22 10:27:27 发布