Question

请考虑以下布局：

<v-menu>
    <span slot="activator">Open dropdown</span>
    <v-list>
        <v-list-tile @click=""><v-list-tile-title>Menu item 1</v-list-tile-title></v-list-tile>
        <v-list-tile @click=""><v-list-tile-title>Menu item 2</v-list-tile-title></v-list-tile>
        <v-list-tile @click=""><v-list-tile-title>Menu item 3</v-list-tile-title></v-list-tile>
        <v-list-tile @click=""><v-text-field label="Search" append-icon="search"></v-text-field></v-list-tile>
    </v-list>
</v-menu>

这将呈现一个“按钮”以打开一个下拉菜单，其中包含3个菜单项和一个用于搜索的文本输入字段作为第4个项。问题是，专注于文本字段会自动折叠菜单。感谢所有帮助，在此先感谢。

Answer 1

只需添加:close-on-click="false"或:close-on-content-click="false"

<v-menu  :close-on-content-click="false"  :close-on-click="false">
    <span slot="activator">Open dropdown</span>
    <v-list>
        <v-list-tile @click=""><v-list-tile-title>Menu item 1</v-list-tile-title></v-list-tile>
        <v-list-tile @click=""><v-list-tile-title>Menu item 2</v-list-tile-title></v-list-tile>
        <v-list-tile @click=""><v-list-tile-title>Menu item 3</v-list-tile-title></v-list-tile>
        <v-list-tile @click=""><v-text-field label="Search" append-icon="search"></v-text-field></v-list-tile>
    </v-list>
</v-menu>

Vuetify.js-在<v-menu>消失之前无法集中<v-menu>中的<v-text-field>

1 个答案: