我正在使用vuetify数据表,并且当我单击“每页行数”选择或输入选择时,带有其选项的菜单显示不正确。我的意思是,它已经渲染并加载了,但是并没有出现在输入下方的预期位置。
我注意到发生了这种情况,因为vuetify绝对定位了此菜单元素。因此,我只应用了以下CSS代码,就可以了。
--custom_vuetify.scss
/* After load vuetify default styles */
/* Don't put it in an scoped styles, it won't work */
.v-menu {
/* position: relative; */
}
.v-menu__content {
top: 0 !important;
left: 0 !important;
}
我尝试在Firefox和另一个结构不同的项目中进行相同的操作。是的,它也可以在他们的页面和Codepen上使用,我真的不知道为什么它不在我的项目中。
以下是示例:
Without my css,它显示“已打开”并创建页面滚动,显然是因为它是计算出的位置。
With my css溢出,但至少显示了
但是有人知道为什么会这样吗? 或者,如果某人遇到这种情况,您该如何解决?
我可以接受这种解决方案,但是我只是想把它留在这里,以防有人遇到相同的问题并想向我们展示其他可行的解决方案。