ant-design checkedKeys 传入父节点key,所有子节点不要选中
时间: 2024-01-24 17:39:05 浏览: 173
ant-design-4.8.6.zip
如果您想要实现只选中父节点而不选中其所有子节点的功能,可以使用`checkStrictly`属性来实现。将`checkStrictly`设置为`true`后,`checkedKeys`仅包含用户选中的节点的key,而不会自动选中其所有子节点。以下是一个示例代码:
```jsx
import { Tree } from 'antd';
const treeData = [
{
title: 'Parent 1',
key: '0-0',
children: [
{
title: 'Child 1',
key: '0-0-1',
},
{
title: 'Child 2',
key: '0-0-2',
},
],
},
];
class Demo extends React.Component {
state = {
checkedKeys: [],
};
onCheck = (checkedKeys) => {
console.log('onCheck', checkedKeys);
this.setState({ checkedKeys });
};
render() {
const { checkedKeys } = this.state;
return (
<Tree
checkable
checkStrictly={true}
checkedKeys={checkedKeys}
onCheck={this.onCheck}
treeData={treeData}
/>
);
}
}
ReactDOM.render(<Demo />, mountNode);
```
在上面的示例中,`checkStrictly`设置为`true`,并且在`Tree`组件中设置了`checkedKeys`属性,该属性仅包含用户选中的节点的key。这样,父节点的key将被添加到`checkedKeys`中,但是其所有子节点不会被选中。
阅读全文