el-select添加filterable导致校验失效

el-select的filterable属性会在下拉列表中添加一个搜索框，但是这个搜索框并不会影响校验功能。可能是其他的因素导致了校验失效，比如校验规则设置错误或者el-select的value值没有被正确赋值。建议检查一下这些方面，以确定具体原因。如果还有问题，可以提供更多的具体信息，我可以帮助你进一步分析。

相关问题

vue3 解决el-select加上filterable， 无数据设置no-data-text="暂无数据"失效问题

当el-select加上filterable属性时，no-data-text属性可能会失效。这是因为当输入框有值时，el-select会根据输入框的值进行筛选，而不是直接显示no-data-text属性的文本。

要解决这个问题，可以通过监听el-select的输入事件，在输入框有值时隐藏no-data-text属性的文本。例如：

<template>
  <el-select v-model="value" filterable @input="handleInput">
    <el-option label="选项1" value="1"></el-option>
    <el-option label="选项2" value="2"></el-option>
  </el-select>
</template>

<script>
export default {
  data() {
    return {
      value: '',
      isFiltering: false
    }
  },
  methods: {
    handleInput() {
      this.isFiltering = true
    }
  },
  computed: {
    noDataText() {
      if (this.isFiltering) {
        return ''
      } else {
        return '暂无数据'
      }
    }
  }
}
</script>

在这个例子中，我们新增了一个isFiltering属性来记录当前是否正在筛选，以便在计算属性noDataText中判断是否显示no-data-text属性的文本。当输入框有值时，我们通过handleInput方法将isFiltering设为true，这时计算属性会返回空字符串，从而隐藏no-data-text属性的文本。当输入框没有值时，计算属性会返回'暂无数据'，从而显示no-data-text属性的文本。

el-select添加搜索框

要在 el-select 中添加搜索框，你可以使用 el-select 的 filterable 属性。将 filterable 设置为 true 后，el-select 将显示一个搜索框，以便用户可以搜索选项。

以下是一个示例代码：

<el-select v-model="selectedValue" filterable>
  <el-option
    v-for="option in options"
    :key="option.value"
    :label="option.label"
    :value="option.value">
  </el-option>
</el-select>

在上面的代码中，v-model 绑定的是选择的值，options 是一个包含选项的数组。当用户在搜索框中输入时，el-select 将根据输入内容过滤选项。

希望能帮助到你！