TreeView 树形结构组件
优质
小牛编辑
128浏览
2023-12-01
树形结构组件。
Usage
全部引入
import { TreeView } from 'beeshell';
按需引入
import { TreeView } from 'beeshell/dist/components/TreeView';
Examples
Code
```js import { TreeView } from 'beeshell';
const nestedData = [ { label: '北京', id: 'beijing', children: [ { label: '朝阳区', id: 'chaoyangqu', children: [{ label: '百子湾', id: 'baiziwan' }] }, { label: '海淀区', id: 'haidianqu' } ] } ]
const flattenedData = [ { label: '北京', id: 'beijing' }, { label: '朝阳区', id: 'chaoyangqu', pId: 'beijing' }, { label: '百子湾', id: 'baiziwan', pId: 'chaoyangqu' }, { label: '海淀区', id: 'haidianqu', pId: 'beijing' } ]
{ console.log(item) }} />
{ console.log(item) }} />
API
Props
Name | Type | Required | Default | Description |
---|---|---|---|---|
style | ViewStyle | false | {} | 按钮样式 |
activeIcon | ReactElement | false | 激活状态图标 | |
unActiveIcon | ReactElement | false | 未激活状态图标 | |
data | any[] | false | [] | 数据源,支持嵌套和扁平的树形结构 |
dataStructureType | string | false | 'nested' | 数据结构类型,支持 'nested' 'flattened' |
fieldKeys | any | false | {} | 数据项的 key 自定义,包括 idKey pIdKey childrenKey activeKey |
onPress | Function | false | null | 点击某项回调,参数为点击项 |