Vuetify选择菜单未显示

时间:2019-05-02 11:22:49

标签: javascript css vue.js sass vuetify.js

我正在使用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溢出,但至少显示了

但是有人知道为什么会这样吗? 或者,如果某人遇到这种情况,您该如何解决?

我可以接受这种解决方案,但是我只是想把它留在这里,以防有人遇到相同的问题并想向我们展示其他可行的解决方案。

0 个答案:

没有答案