@alicd/crui-tree-select-field
Version:
树形下拉框
36 lines (32 loc) • 1.31 kB
Markdown
---
order: 0
title: 基本使用
---
````jsx
import TreeSelectField from '@alicd/crui-tree-select-field';
import { TreeSelect} from '@alicd/next';
ReactDOM.render(<TreeSelectField inputStyle={{width: 200}} autoWidth={false} treeDefaultExpandAll={true} hasClear={true} style={{ width: 200 }}>
<TreeSelect.Node key="1" value="1" label="服装">
<TreeSelect.Node key="2" value="2" label="男装">
<TreeSelect.Node key="4" value="4" label="外套" />
<TreeSelect.Node key="5" value="5" label="夹克" />
</TreeSelect.Node>
<TreeSelect.Node key="3" value="3" label="女装">
<TreeSelect.Node key="6" value="6" label="裙子" />
</TreeSelect.Node>
</TreeSelect.Node>
</TreeSelectField>, mountNode);
````
```` template
<TreeSelectField inputStyle={{width: 200}} autoWidth={false} treeDefaultExpandAll={true} hasClear={true} style={{ width: 200 }}>
<TreeSelect.Node key="1" value="1" label="服装">
<TreeSelect.Node key="2" value="2" label="男装">
<TreeSelect.Node key="4" value="4" label="外套" />
<TreeSelect.Node key="5" value="5" label="夹克" />
</TreeSelect.Node>
<TreeSelect.Node key="3" value="3" label="女装">
<TreeSelect.Node key="6" value="6" label="裙子" />
</TreeSelect.Node>
</TreeSelect.Node>
</TreeSelectField>
````