如何在Vuejs中设置v-snackbar vuetify组件的底部位置样式？
如何在Vuejs中设置v-snackbar vuetify组件的底部位置样式？
提问于 2021-08-26 23:45:46
我正在尝试从底部堆叠多个v-snackbars。设置bottom属性的内联样式似乎不会影响它。
Snackbar.vue
<template>
<div>
<v-snackbar
v-for="(snackbar, index) in snackbars"
:key="index"
v-model="snackbar.visible"
:color="snackbar.color"
:style="{ bottom: `${index * 60 + 8}px` }"
>
{{ snackbar.text }} </v-snackbar>
<div>
</template>
...App.vue
<template>
<v-app>
<ProgressCircular />
<Snackbar />
<v-main>
<transition mode="out-in" name="fade">
<router-view />
</transition>
</v-main>
</v-app>
</template>回答 1
Stack Overflow用户
发布于 2021-08-31 13:53:32
您需要添加“绝对”属性。
<v-snackbar
v-for="(snackbar, index) in snackbars"
:key="index"
v-model="snackbar.visible"
:color="snackbar.color"
:style="{ bottom: `${index * 60 + 8}px` }"
absolute
bottom
>
{{ snackbar.text }}
</v-snackbar>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/68946490
复制相关文章
相似问题
腾讯云开发者
