el-select的clear方法

el-select的clear方法是用来清空选择的选项。在底层源码中，clear方法的实现是通过调用deleteSelected方法来实现的。在deleteSelected方法中，会将选择的值设置为空，并触发input事件和change事件。另外，还会将visible属性设置为false，并触发clear事件。所以，当使用el-select的clear方法时，会清空选择的选项并触发相应的事件。<span class="em">1</span><span class="em">2</span><span class="em">3</span>

相关问题

el-select clear事件禁止触发visible-change

您想要禁止 el-select 组件的 clear 事件触发 visible-change 事件，是这样吗？如果是的话，您可以通过监听 clear 事件，并在事件处理程序中取消 visible-change 事件的触发。以下是一个示例代码：

<el-select @clear="handleClear" @visible-change="handleVisibleChange"></el-select>

methods: {
  handleClear() {
    // 取消 visible-change 事件的触发
    this.$nextTick(() => {
      this.$refs.select.blur();
    });
  },
  handleVisibleChange(visible) {
    if (!this.$refs.select.blur) {
      // 执行 visible-change 事件的逻辑
      // ...
    }
  }
}

在 handleClear 方法中，我们使用 `$nextTick` 来确保 blur() 方法在下一个 DOM 更新周期后执行，以便取消 visible-change 事件的触发。然后在 handleVisibleChange 方法中，我们检查 select 元素是否失去焦点，如果没有失去焦点，则执行 visible-change 事件的逻辑。

希望这个示例能够帮助到您！如果您有任何进一步的问题，请随时提问。

el-select clear事件怎样拿到输入框的值

`el-select` 的 `clear` 事件是在清空选中项时触发的，此时输入框中的值已经被清空了，无法通过 `clear` 事件获取到输入框的值。

如果您需要获取输入框的值，可以使用 `el-input` 组件的 `clearable` 属性和 `clear` 事件来实现。当用户点击清空按钮时，`clear` 事件会被触发，此时可以通过 `ref` 来获取到 `el-input` 组件的引用，并通过该引用获取输入框中的值。以下是一个示例代码：

<template>
  <div>
    <el-input ref="myInput" v-model="inputValue" clearable @clear="handleClear"></el-input>
  </div>
</template>

<script>
export default {
  data() {
    return {
      inputValue: '',
    };
  },
  methods: {
    handleClear() {
      const inputRef = this.$refs.myInput; // 获取 el-input 组件的引用
      console.log('输入框的值为：', inputRef.value); // 获取输入框中的值
    },
  },
};
</script>

这样，在 `el-input` 的 `clear` 事件中，您可以通过 `this.$refs.myInput.value` 来获取输入框中的值。