antd 中 Tree 的使用-默认选中问题

在使用antd的Tree 控件的控件的时候,数据回显的时候发现所有的都选中了,很奇怪

            <Tree 
			         checkable ={true}
			         showLine = {true}
					 multiple={true}
			         titleRender = {(nodeData) => {return <span style = {{fontSize: '18px',}} > {nodeData.title} < /span>}}
					 defaultCheckedKeys={this.state.defaultCheckedKeys}
			         defaultExpandedKeys = {this.state.defaultCheckedKeys}
			         onCheck = {this.onCheck}
					 autoExpandParent={true}
			         treeData = {this.state.treeData}
				  />

我是这样设置的 defaultCheckedKeys

defaultCheckedKeys默认选中复选框的树节点

默认选择的节点,为什么选中了所有的节点

并且有一个特点是,如果父节点是选中状态,那么子节点就默认选中了,那么这样的回显并不是准确的,所以问题在于当回显的时候父节点被选中了,子节点不需要被选中

checkedKeys(受控)选中复选框的树节点(注意:父子节点有关联,如果传入父节点 key,则子节点自动选中;相应当子节点 key 都传入,父节点也自动选中。当设置 checkable 和 checkStrictly,它是一个有checkedhalfChecked属性的对象,并且父子节点的选中与否不再关联string[] | {checked: string[], halfChecked: string[]}[]
checkStrictlycheckable 状态下节点选择完全受控(父子节点选中状态不再关联)

checkStrictly 可以实现这个功能

               <Tree 
			         checkable
					 checkStrictly
			         showLine
					 multiple
					 autoExpandParent
			         titleRender = {(nodeData) => {return <span style = {{fontSize: '18px',}} > {nodeData.title} < /span>}}
					 defaultCheckedKeys={this.state.defaultCheckedKeys}
			         defaultExpandedKeys = {this.state.defaultCheckedKeys}
			         onCheck = {this.onCheck}
			         treeData = {this.state.treeData}
				  />

希望对你有所帮助

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值