第一个选择时下拉自动关闭，但第二个 select 正常工作 vue-multiselect

Question

我有问题，当第一个 select 下拉窗口将关闭时，即使我设置close-on-select="false" ，下拉列表仍然隐藏在第一个 select 之后，但自下一个 select 以来它正常工作
可以直接在首页链接看到： vue-multiselect
或者你可以在这里观看视频

这是我的代码：

              <Multiselect
                v-model="form.users_ids"
                id="students"
                label="name"
                class="chat-bulk-form-mul"
                :custom-label="nameWithRelation"
                :options="optionUsers"
                :multiple="true"
                :clear-on-select="false"
                :close-on-select="false"
                :preserve-search="true"
                :hide-selected="true"
                :max-height="200"
                :internal-search="false"
                @async-find="asyncFind"
                @infinite-scroll="infiniteScroll"
              />

Answer 1

不确定，因为您的配置似乎正确。 但是，文档中提到了一个新步骤，即通过 CDN 添加 CSS。 也许您忘记添加正确的 CDN。
另一个原因可能是，我在文档中看不到任何名为async-find的事件。 有一个名为asyncFind的方法可以在调用搜索查询时使用。

尝试将您的asynFind方法和 rest 配置与此示例匹配 -

<template>
  <div id="app">
    <label>Simple select / dropdown</label>
    <multiselect
      v-model="value"
      :options="options"
      :multiple="true"
      :clear-on-select="false"
      :close-on-select="false"
      :preserve-search="true"
      :hide-selected="true"
      :max-height="200"
      :internal-search="false"
      label="name"
      track-by="name"
      :custom-label="customLabel"
      @search-change="asyncFind"
    >
    </multiselect>
  </div>
</template>

<script>
import Multiselect from "vue-multiselect";

export default {
  name: "App",
  components: {
    Multiselect,
  },
  data() {
    return {
      value: [],
      options: [
        { name: "Vue.js", language: "JavaScript" },
        { name: "Adonis", language: "JavaScript" },
        { name: "Rails", language: "Ruby" },
        { name: "Sinatra", language: "Ruby" },
        { name: "Laravel", language: "PHP" },
        { name: "Phoenix", language: "Elixir" },
      ],
    };
  },
  methods: {
    customLabel({ name, language }) {
      return `${name} – ${language}`;
    },
    asyncFind(query) {
      console.log(query);
    },
  },
};
</script>

<style src="vue-multiselect/dist/vue-multiselect.min.css"></style>

这是工作演示。