elementui select 下拉全选

Element UI的Select组件默认不支持下拉全选的功能，但你可以通过一些自定义的方式来实现下拉全选。下面是一个实现下拉全选的例子：

首先，你需要在数据中添加一个用于存储选中项的数组变量，比如`selectedOptions`。

data() {
  return {
    options: [
      { label: '选项1', value: '1' },
      { label: '选项2', value: '2' },
      { label: '选项3', value: '3' },
      // 其他选项...
    ],
    selectedOptions: [],
  };
},

然后，在Select组件上添加一个额外的选项，用于全选和取消全选。

<template>
  <div>
    <el-select v-model="selectedOptions" multiple>
      <el-option v-for="option in options" :key="option.value" :label="option.label" :value="option.value"></el-option>
      <el-option v-if="selectedOptions.length > 0" :label="selectedOptions.length === options.length ? '取消全选' : '全选'" :value="selectAllValue"></el-option>
    </el-select>
  </div>
</template>

接下来，你需要在Vue实例中定义全选的值，以及处理下拉框选项变化的方法。

computed: {
  selectAllValue() {
    return 'all';
  },
},
watch: {
  selectedOptions(newValues) {
    if (newValues.includes(this.selectAllValue)) {
      this.selectedOptions = newValues.filter(value => value !== this.selectAllValue);
      this.options.forEach(option => {
        if (!this.selectedOptions.includes(option.value)) {
          this.selectedOptions.push(option.value);
        }
      });
    }
  },
},

最后，你可以在其他需要使用选中项的地方，使用`selectedOptions`来获取选中的值。

console.log(this.selectedOptions);

这样，当你选择了"全选"选项时，所有选项将被选中，并且`selectedOptions`数组也会包含所有选项的值。注意，当取消全选时，需要将"全选"选项从`selectedOptions`中移除。