自定义 v-select 下拉位置

Question

我正在使用 vuetify v-select 组件。我面临的问题不是向下打开下拉菜单，而是希望它向上打开，因为下拉菜单位于页面底部，因此某些下拉项目不会出现。如下图所示，有多个选项是 Nunavut 没有出现。请帮我解决这个问题。

<v-layout row wrap>
 <v-flex md6 xs12>
  <v-select
   :items="states"
   :closeOnSelect="true"
   multiple
   attach
   item-text='name'
   item-value='id'
  ></v-select>
 </v-flex>
</v-layout>

Answer 1

您可以使用menu-props查看文档

<v-select
 :items="states"
 :closeOnSelect="true"
 multiple
 attach
 :menu-props="{ top: true, offsetY: true }"
 item-text='name'
 item-value='id'
></v-select>

Answer 2

这就是我通过添加auto解决这个问题的方法

<v-layout row wrap>
 <v-flex md6 xs12>
  <v-select
   :items="states"
   :closeOnSelect="true"
   multiple
   attach
   item-text='name'
   item-value='id'
   auto
  ></v-select>
 </v-flex>
</v-layout>