Question

我有一个使用Vuetify（Vue 2.0）的简单选择菜单，在这里显示：

已添加选项，但菜单不会像其他选项一样关闭并选择，并且菜单保持打开状态

我的参考资料来自Vuetify文档：https://vuetifyjs.com/en/components/selects

在“添加/添加商品位置”下

<div id="app">
    <v-app dark>
        <v-select
          :items="items"
          clearable
          v-model='selectedItem'
          label="...will 'four' close menu?"
        >

          <template v-slot:append-item>
            <v-divider class="mb-2"></v-divider>
            <v-list-tile >
              <v-list-tile-content>
                four
              </v-list-tile-content>
            </v-list-tile>
          </template>

        </v-select>

    </v-app>
</div>

var vm = new Vue({
    el: "#app",

    data: {
        items: ["one", "two", "three"],
        selectedItem: ''
    }
});

Answer 1

您使用的是v0.14.8版，甚至v0.15都不支持所需的插槽。考虑更新。

https://v1.vuetifyjs.com/releases/0.15/#/components/selects

Answer 2

我收到了Vuetify开发人员的答复：

我需要添加：：menu-props =“ {closeOnContentClick：true}”

<v-select
      :items="items"
      clearable
      v-model='selectedItem'
      :menu-props="{closeOnContentClick: true}"
      label="...will 'four' close menu?">

验证追加项目以选择菜单而不选择正常项目

2 个答案: