react+antd+dva --->TreeSelect 树选择器组件的不联动+多选+初始值渲染

 

 

普通的用法不赘述了,记录的关键是这次的需求

产品大佬的要求是这样的:

1.我们树父与子之间互不关联

2.选中时输入框显示互不关联

以上两点好说,加俩属性嘛:

那么问题来了,加了这俩属性之后,文档的描述是这样的:

秀,给我来个强制,理解不了看下上下文,也就是说:

ok,也就是我们每次选中的时候,得到的不再是字符串数组,而是数组里包裹着一条一条的对象,俩属性,一个label做标题,一个value。

那么做初始化的时候,我们需要给的初始化数据就必须是对象的数据,然而后端朋友返回的value和label是分开的俩字段,还都是逗号分隔的字符串!

 

此时此刻俺的内心有好多好多小马儿奔腾而过!但是没什么,这不是什么大事,我们拼接嘛!

然而拼了半天,赋在表单初始值中的这个数组却在点击时出现了问题:

带秀。

经过各种尝试都宣告失败以后,我想转行。

然而在绝望的持续尝试之时,看到了官方文档的value是通过state来修改的,并且没有任何问题!

小小灵魂跃跃欲试!瞬间写个state!

回调里再来个拼接!

 

 return里表单的初始值修改成state!

onChange的方法改为修改state!

完美!!!!!

 

另外附上数据的转树形结构方法:

 

posted @   芝麻小仙女  阅读(3274)  评论(0编辑  收藏  举报
编辑推荐:
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
阅读排行:
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· AI技术革命,工作效率10个最佳AI工具
点击右上角即可分享
微信分享提示