elementui select下拉框远程搜索+多选回显问题

在使用 Element UI 的 Select 组件进行下拉框远程搜索和多选时，可以通过以下方式实现：

1. 远程搜索：使用 remote-method 属性，该属性绑定一个方法，这个方法会在输入框输入值时触发，从而可以实现远程搜索。
2. 多选回显：使用 v-model 进行数据双向绑定，并将 multiple 属性设置为 true 以启用多选功能。在回显时，你需要将已选项的值设置到 v-model 绑定的数组中。

以下是一个简单的示例代码：

<template>
  <el-select
    v-model="selectedValues"
    multiple
    filterable
    remote
    placeholder="请输入关键词"
    :remote-method="searchOptions"
    :loading="loading">
    <el-option
      v-for="item in options"
      :key="item.value"
      :label="item.label"
      :value="item.value">
    </el-option>
  </el-select>
</template>
 
<script>
export default {
  data() {
    return {
      selectedValues: [], // 用于v-model的数组
      options: [], // 下拉选项数组
      loading: false // 远程搜索时的加载状态
    };
  },
  methods: {
    searchOptions(query) {
      if (query !== '') {
        this.loading = true;
        // 模拟远程搜索
        setTimeout(() => {
          this.loading = false;
          this.options = this.mockOptions.filter(item => item.label.includes(query));
        }, 200);
      } else {
        this.options = [];
      }
    }
  },
  created() {
    // 初始化选项，这里使用模拟数据
    this.options = this.mockOptions;
  },
  computed: {
    // 模拟数据
    mockOptions() {
      return [
        { value: '1', label: '选项1' },
        { value: '2', label: '选项2' },
        // ...更多选项
      ];
    }
  }
};
</script>

在这个示例中，selectedValues 是多选下拉框的绑定值，它是一个数组。options 是下拉框的选项数组，其中每个元素包含 value 和 label 属性。searchOptions 方法用于远程搜索，当输入框中的值变化时，该方法会被调用，并过滤出包含输入关键词的选项。

在实际应用中，你需要将 mockOptions 替换为远程获取的实际数据，以及将 searchOptions 中的模拟Ajax调用替换为实际的远程搜索请求。