提交 aca09cf1 编写于 作者: I ioldfish

update ant-tree

上级 67a40273
# 接收外部传参
- order: 2
受控组件,外部传入参数,控制树对象节点
---
````jsx
var Tree = antd.Tree;
var TreeNode = Tree.TreeNode;
var Button = antd.Button;
class TreeDemo extends React.Component {
constructor(props) {
super(props);
['handleClick', 'handleCheck', 'handleSelect'].forEach((m)=> {
this[m] = this[m].bind(this);
});
this.state = {
checkedKeys: [],
selectedKeys: []
}
}
handleClick() {
this.setState({
checkedKeys: ['p11'],
selectedKeys: ['p21', 'p11']
})
}
handleCheck(info) {
console.log('check: ', info);
this.setState({
checkedKeys: ['p21'],
selectedKeys: ['p1', 'p21']
})
}
handleSelect(info) {
console.log('selected: ', info);
this.setState({
checkedKeys: ['p21'],
selectedKeys: ['p21']
})
}
render() {
return (<div>
<Tree defaultExpandAll={true} checkable={true}
onCheck={this.handleCheck} checkedKeys={this.state.checkedKeys}
onSelect={this.handleSelect} selectedKeys={this.state.selectedKeys} multiple>
<TreeNode title="parent 1" key="p1">
<TreeNode key="p10" title="leaf"/>
<TreeNode title="parent 1-1" key="p11">
<TreeNode title="parent 2-1" key="p21">
<TreeNode>test</TreeNode>
<TreeNode title={<span>sss</span>}/>
</TreeNode>
<TreeNode key="p22" title="leaf"/>
</TreeNode>
</TreeNode>
<TreeNode key="p12" title="leaf"/>
</Tree>
<Button type="primary" size="sm" onClick={this.handleClick}>点此控制树节点</Button>
</div>);
}
}
React.render(<TreeDemo />, document.getElementById('components-tree-demo-special'));
````
......@@ -23,6 +23,7 @@
|defaultCheckedKeys | 默认选中复选框的树节点 | String[] | [] |
|defaultSelectedKeys | 默认选中的树节点 | String[] | [] |
|onCheck | 点击树节点或复选框触发 | function(e:{checked:bool,node,checkedKeys,event}) | - |
|onSelect | 点击树节点触发 | function(e:{checked:bool,node,checkedKeys,event}) | - |
### TreeNode props
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册