<v-tooltip top>
<template v-slot:activator="{ on }">
<v-btn
fab
color="green"
v-on="on"
bottom
right
fixed
:loading="isRefreshing"
@click="refreshFiles"
>
<v-icon color="white">mdi-sync</v-icon>
</v-btn>
</template>
<span>Refresh</span>
</v-tooltip>
<v-bottom-navigation v-if="isMobileViewVisible" app fixed grow shift>
<template v-for="item in menuItems">
<v-btn
v-if="item.isVisible"
:key="item.title"
icon
@click="goToRoute({ name: item.name, params: item.params })"
>
<span>{{ item.title }}</span>
<v-icon>{{ item.icon }}</v-icon>
</v-btn>
</template>
<v-btn icon @click="toProfileEdit">
<span>Profile</span>
<v-icon>mdi-account</v-icon>
</v-btn>
</v-bottom-navigation>
我正在使用 vuejs 和 vuetify,我有一个查询被卡住了,问题是我使用底部导航栏路由到各种组件(页面),并且每个页面的右下角都有一个浮动操作按钮,问题浮动操作按钮隐藏在底部导航栏中。
有没有关于如何克服这个问题的想法或方法??
如您所见,绿色按钮隐藏在底部导航栏后面。
答案 0 :(得分:1)
尝试使用内联样式:
{
"rules": {
"Projects": {
"$uid": {
".read": "$uid === auth.uid",
".write": "$uid === auth.uid"
}
},
"Contacts": {
"$uid": {
".read": "$uid === auth.uid",
".write": "$uid === auth.uid"
}
}
}
}