树节点模型 NodeModel
1.说明
树组件Tree的节点数据模型
2.参数顺序
constructor(value, text, isParent = false)
3.API
| 参数名 | 默认值 | 参数说明 |
|---|---|---|
| value | text | 值 |
| text | null | 标题 |
| isParent | false | 是否父节点,如果没有强制，则会根据是否有子节点来判断是为父节点 |
| tip | null | 提示信息 |
| iconCls | icon-file | 默认图标 |
| iconClose | icon-folder | 关闭图标 |
| iconOpen | icon-open-folder | 打开的图标 |
| open | false | 是否处于打开状态 |
| selected | false | 是否被选中 |
| checked | false | 是否被勾选,暂未开放 |
| checkAble | false | 是否允许勾选,暂未开放 |
| checkedType | {"Y": "ps", "N": "ps"} | 勾选对于父子节点的关联关系 |
| href | # | 节点的链接 |
| url | null | 子节点加载的url地址,暂未开放 |
| key | id | 向后台传输的字段名 |
| params | null | 向后台传输的额外参数 |
| data | [] | 子节点数据 |
| onSelect | null | 选中后的事件 |
4.代码演示
/**
* Created by ALOG on 17/6/5.
*/
let React =require( "react");
let ReactDOM=require("react-dom");
let wasabi=require("wasabiD");
let Tree=wasabi.Tree;
class Demo extends React.Component {
render(){
var data=[
{value:1,text:"节点1",open:true,data:[{value:11,text:"节点11",isParent:false},{value:12,text:"节点12"},{value:13,text:"节点13"}]},
{value:2,text:"节点2",data:[{value:21,text:"节点21"},{value:22,text:"节点22"},{value:23,text:"节点23"}]},
{value:3,text:"节点3",isParent:true},
{value:4,text:"节点4"},
{value:5,text:"节点5"},
{value:6,text:"节点6"},
{value:7,text:"节点7"},
{value:8,text:"节点8"},
{value:9,text:"节点9"},
{value:10,text:"节点10"},
]
return (
<Tree data={data} ></Tree>
)
}
}
ReactDOM.render(<Demo/>,document.getElementById("root"));