a-tree-select的搜索设置

项目中要使用属性结构,数据过多的时候需要搜索

image.png

类似这种
代码

  <a-tree-select show-search
                               style="width: 100%"
                               :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                               v-model="form.deptIds"
                               placeholder="请选择使用机构"
                               allow-clear
                               multiple
                               tree-node-filter-prop="title"
                               :replaceFields="replaceFields"
                               :tree-data="deptTreeData"
                               @change="onChangeTree"
                               @search="onSearchTree"
                               @select="onSelectTree">
                </a-tree-select>

一般使用属性replaceFields来把后台的数据转为a-tree-select可用的数据字段

 replaceFields: {
                children: 'childrens',
                title: 'title',
                key: 'id',
                value: 'id'
            },

设置tree-node-filter-prop="title" 就可以搜索文字,筛选对应的数据,选择还是对应value,一版value是设置的id