vuetify框架下的Vue项目弹窗留白
在使用vuetify框架的v-dialog时,点击侧边栏,弹出弹框,因内容过长,所以留白。
Q:
猜测可能的原因:
----1、document.body.clientHeight监听的是屏幕可视高度
<v-dialog v-model="dialog7" fullscreen transition="dialog-bottom-transition">
<layout column fill-height>
<v-card :height="displayHeight"></v-card>
</layout>
</v-dialog>
data(){displayHeight: 0}
mounted(){this.displayHeight = document.body.clientHeight}
----2、布局问题
<v-dialog>
<v-layout> <!--此处导致上图问题-->
<v-flex xs12> <!--此处导致下图一问题-->
<v-toolbar></v-toolbar>
</v-flex>
<v-flex xs12>
<v-card>
</v-card>
</v-flex>
</v-layout>
</v-dialog>
A:
删除<v-layout></v-layout> <v-flex></v-flex>
得以下效果,内容加长,则背景也加长,不会留白