antd 1.x版本a-tree-select实现autoClearSearchValue功能 -选择后不清空搜索

最新推荐文章于 2024-12-12 16:53:40 发布

鸽子鸽

最新推荐文章于 2024-12-12 16:53:40 发布

阅读量521

点赞数 3

文章标签：前端 vue anti-design-vue

本文链接：https://blog.youkuaiyun.com/assfafa/article/details/138283159

版权

文章讲述了在Vue2的老版本项目中，使用antd的a-tree-select组件时遇到的搜索值清空问题。作者发现通过调整事件顺序并利用临时变量存储搜索值，可以在change事件中恢复搜索状态，提供了解决方案。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

vue2跟这些老版本项目坑真是太多啦！！！！

antd a-tree-select标签在选择后搜索会被清空重新展开所有树

在网上找了一圈发现只有3.x以后的版本才给了选择还没找到解决办法

本来想做个延时处理低于一定时间改searchValue找回的

结果发现个更简单的办法

首先可以看到能用来使用的事件有三个

把三个事件排下顺序发现分别是select-search-change select执行的时候searchValue是有数据的change 改变后就没了也就是顺序 select>清空搜索>change 这就好办多了

select内随便用个变量做一个临时储存 Change内找回来就行

<a-tree-select @select="select(item)" :searchValue.sync="item.searchValue"  @change="(tissue)=>{change(item)}" />

select(item){
    item.searchValueItem = item.searchValue;
},
change(item,tissue) {
    item.searchValue = item.searchValueItem;
}