ant-design/components/tree-select/demo/treeData.md

56 lines
963 B
Markdown
Raw Normal View History

2016-02-01 17:06:54 +08:00
# 从数据直接生成
- order: 1
使用 `treeData` 把 JSON 数据直接生成树结构。
---
````jsx
import { TreeSelect } from 'antd';
const treeData = [{
label: '节点一',
value: '0-0',
key: '0-0',
children: [{
label: '子节点一',
value: '0-0-1',
key: '0-0-1',
2016-02-01 17:06:54 +08:00
}, {
label: '子节点二',
value: '0-0-2',
key: '0-0-2',
2016-02-01 17:06:54 +08:00
}],
}, {
label: '节点二',
value: '0-1',
key: '0-1',
2016-02-01 17:06:54 +08:00
}];
const Demo = React.createClass({
getInitialState() {
return {
value: '',
};
},
onChange(value) {
console.log(arguments);
this.setState({ value });
},
render() {
return (
2016-02-22 23:51:26 +08:00
<TreeSelect style={{ width: 300 }}
2016-02-01 17:06:54 +08:00
value={this.state.value}
2016-02-29 16:52:53 +08:00
dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
2016-02-01 17:06:54 +08:00
treeData={treeData}
placeholder="请选择"
treeDefaultExpandAll
onChange={this.onChange} />
);
},
});
ReactDOM.render(<Demo />, mountNode);
````