elementui选择器多选时闪_element-ui中select选择器之多选属性multiple的问题？

这个问题可能是由于使用了 ElementUI 的 Select 组件的多选属性 multiple，但是在数据更新时会导致组件重新渲染，从而导致闪动的问题。解决这个问题的方法有以下几种：

1. 使用 v-show 控制多选框的显示和隐藏，而不是使用 v-if 控制整个 Select 组件的显示和隐藏。

2. 使用 Vue 的 keep-alive 组件缓存 Select 组件，避免组件在每次更新时都重新渲染。

3. 使用 ElementUI 的 Select 组件中的 filterable 属性，让用户可以搜索需要选择的选项，这样就不需要使用多选属性了。

希望这些方法可以帮助你解决问题。如果还有其他疑问，请随时提出。

相关问题

使用element-ui中Select 选择器多选的情况下，怎样实现el-option选项选中一个另一个取消勾选，实现el-option互斥

你可以使用select 组件的 @change 属性监听值的变化，然后在方法中对选中的选项进行处理，将选中的选项以外的其他选项的选中状态设为 false。可以参考如下代码实现：

<template>
  <el-select v-model="selectedOptions" multiple @change="handleOptionChange">
    <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 {
      selectedOptions: [],
      options: [
        { label: '选项一', value: 'option1' },
        { label: '选项二', value: 'option2' },
        { label: '选项三', value: 'option3' },
        { label: '选项四', value: 'option4' },
      ],
    }
  },
  methods: {
    handleOptionChange(val) {
      const selectedValue = val[val.length - 1]
      this.options.forEach((option) => {
        if (option.value !== selectedValue) {
          option.state = false
        }
      })
    },
  },
}
</script>

在以上代码中，通过监听 Select 组件的 change 事件，获取选中的选项的值。然后对 options 数组进行遍历，对选中的选项以外的其他选项的选中状态设置为 false。这样就可以实现 ElOption 的互斥了。

elementui中当el-select下拉框绑定multiple多选后无法编辑删除

### 回答1：
elementui中的el-select下拉框组件是一个选择器，它可以用来单选或者多选。当我们给el-select组件绑定multiple属性时，它就可以实现多选功能。但是这样绑定multiple属性后，下拉框将不能进行编辑和删除。

实际上，多选的下拉框不提供编辑和删除功能是因为这样的设计逻辑。多选下拉框最多允许用户选择多个选项，而不支持编辑和删除已选中的选项。通过点击下拉框展开选项，用户可以选择自己所需的多个选项，但是不能对已选中的选项进行直接编辑或删除。

如果我们需要对已选中的选项进行修改或删除，可以通过其他方式来实现。比如，可以在多选下拉框的旁边添加一个"编辑"或"删除"的按钮，当用户点击这个按钮时，弹出一个对话框或者列表，用户可以在其中编辑或删除已选中的选项。

总结来说，elementui中的el-select下拉框组件绑定multiple多选后无法直接编辑和删除已选中的选项，但是我们可以通过增加其他操作，比如添加按钮和弹出对话框等，来实现对已选中选项的编辑和删除操作。

### 回答2：
在Element UI中，el-select下拉框绑定了multiple多选后，无法直接编辑删除选项。这是因为多选的特性要求用户通过勾选或取消勾选选项来进行选择和取消选择，而不是直接编辑删除选项。

如果你想删除已选择的选项，可以通过以下方法实现：

1. 通过v-model指令将已选择的选项绑定到一个数据属性中。例如，将已选择的选项绑定到一个名为selectedOptions的数组属性中。

2. 在页面上，以列表或其他形式展示已选择的选项，并为每个选项提供删除按钮。

3. 当用户点击删除按钮时，触发对应的方法。在方法中，我们可以通过数组的splice方法，根据选项的索引从selectedOptions数组中删除对应的选项。

下面是一个简单的示例：

<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-select>
    <ul>
      <li v-for="(option, index) in selectedOptions" :key="option">
        {{ option.label }}
        <button @click="removeOption(index)">删除</button>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      options: [
        { label: "选项1", value: "option1" },
        { label: "选项2", value: "option2" },
        { label: "选项3", value: "option3" }
      ],
      selectedOptions: []
    };
  },
  methods: {
    removeOption(index) {
      this.selectedOptions.splice(index, 1);
    }
  }
};
</script>

通过以上方法，我们可以实现在el-select的多选模式下删除已选择的选项。