如何根据其父组件在屏幕上的位置移动Vuetify组件```VDatePicker```

时间:2019-07-02 13:27:01

标签: javascript css vue.js vuetify.js

我正在使用vuetify中的VMenu组件,它内部是另一个vuetify组件VDatePicker。功能是这样的,当我单击文本字段时,可以看到日历(VDatePicker)。 VDatePicker组件通常始终显示在文本字段下方,只要该字段下方有足够的空间直到屏幕末端。

但是现在的问题是文本字段的位置使得文本字段和屏幕末端之间的空间很小,因此DatePicker尝试将其自身调整为自己并将其推到上方一点,因此将字段隐藏在下面(附带快照)。

问题是,我该如何移动它,以便在这种情况下,如果字段和屏幕末端之间的空间很小,那么它应该将自身定位在文件的顶部而不是其上方。{{3} }

1 个答案:

答案 0 :(得分:0)

我假设您想将其移到一边? 您可以在nude-right="300px"中使用v-menu将Datepicker 300px移到右侧

样本: https://codepen.io/j3n50m4t/pen/xxZzVLG