如何聚焦和激活 vue 多选？

Question

当用户双击它时：

<div 
  class="open-select" 
  v-if="!editable" 
  @dblclick="editable=true">{{ name }} 
</div>

我希望这个多选是开放和专注的：

<multiselect
    v-else
    v-model="name"
    :options="names"
    track-by="id"
    tabindex="0"
    autofocus
    @select="editable=false"
></multiselect>

双击事件显示多选元素很好，但多选仍然需要用户单击它才能打开。我希望它出现后自动打开。

我尝试过的事情：

• 聚焦多选：
  • 标签索引=“0”
  • 自动对焦
  • 当我尝试在 jQuery 中选择焦点项目时$(':focus')[0]，我得到“未定义”

Answer 1

嘿！

您可以在组件上放置一个 ref，然后触发将打开下拉列表的焦点。

<multiselect ref="vms" v-bind="yourAttributes" />

然后在您创建的钩子中添加

this.$refs.vms.$el.focus()