在elementui的级联选择器中,可以使用filter-method属性来自定义搜索逻辑。该属性的第一个参数是节点,可以通过该参数获取当前选中的值。

以下是一个示例代码:

<el-cascader
  v-model="selectedOptions"
  :options="options"
  :props="props"
  :filter-method="filterMethod"
></el-cascader>
data() {
  return {
    selectedOptions: [],
    options: [
      {
        value: '1',
        label: 'Option 1',
        children: [
          {
            value: '1-1',
            label: 'Sub Option 1-1'
          },
          {
            value: '1-2',
            label: 'Sub Option 1-2'
          }
        ]
      },
      {
        value: '2',
        label: 'Option 2',
        children: [
          {
            value: '2-1',
            label: 'Sub Option 2-1'
          },
          {
            value: '2-2',
            label: 'Sub Option 2-2'
          }
        ]
      }
    ]
  }
},
methods: {
  filterMethod(query, node) {
    // 获取当前选中的值
    console.log(this.selectedOptions);

    // 自定义搜索逻辑
    return node.label.toLowerCase().indexOf(query.toLowerCase()) > -1;
  }
}

在上述示例中,selectedOptions是用来存储当前选中的值的数据属性。在filterMethod方法中,可以通过this.selectedOptions获取当前选中的值。根据需要,可以自定义搜索逻辑并返回结果。

请注意,this.selectedOptions在级联选择器的选项变化时会更新,因此可以获取到最新的选中值

使用elementui级联选择器获取当前选中的值filter-method	自定义搜索逻辑第一个参数是节点

原文地址: https://www.cveoy.top/t/topic/it2j 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录