多选树型视图 MultiTreeView
在TreeView的基础上,添加了多选功能。
示例
基本形式
<multiTreeView source={source} />
var component = new RGUI.Component({
template: template,
data: {
source: [
{name: '节点1', children: [
{name: '节点1.1'},
{name: '节点1.2', children: [
{name: '节点1.2.1'},
{name: '节点1.2.2'}
]},
{name: '节点1.3'},
{name: '节点1.4'},
]},
{name: '节点2'},
{name: '节点3', children: [
{name: '节点3.1'},
{name: '节点3.2'}
]}
]
}
});
API
Class
MultiTreeView
继承自TreeView。
Options
new MultiTreeView()
参数 | 类型 | 默认值 | 数据流向 | 描述 |
---|---|---|---|---|
data | object | 绑定属性 | ||
data.source | object[] | [] | outer <=> inner | 数据源 |
data.source[].name | string | outer => inner | 每项的内容 | |
data.source[].open | boolean | false | outer => inner | 此项为展开/收起状态 |
data.source[].checked | boolean | false | outer => inner | 选中此项 |
data.source[].disabled | boolean | false | outer => inner | 禁用此项 |
data.source[].divider | boolean | false | outer => inner | 设置此项为分隔线 |
data.selected | object | null | outer <=> inner | 当前选择项。多选时无效。 |
data.itemTemplate | string | null | outer @=> inner | 单项模板 |
data.hierarchical | boolean | false | outer @=> inner | 是否分级动态加载,需要service |
data.readonly | boolean | false | outer => inner | 是否只读 |
data.disabled | boolean | false | outer => inner | 是否禁用 |
data.visible | boolean | true | outer => inner | 是否显示 |
data.class | string | '' | outer => inner | 补充class |
service | object | outer @=> inner | 数据服务 |
Inherited Methods
multiTreeView.select(item)
选择某一项
参数 | 类型 | 默认值 | 描述 |
---|---|---|---|
item | object | 选择项 | |
返回值 | 类型 | 描述 | |
无返回值 |
multiTreeView.toggle(item, open)
展开/收起某一项
参数 | 类型 | 默认值 | 描述 |
---|---|---|---|
item | object | 处理项 | |
open | object | 展开/收起状态。如果无此参数,则在两种状态之间切换。 | |
返回值 | 类型 | 描述 | |
无返回值 |
@deprecated multiTreeView.$updateSource()
从service中更新数据源
参数 | 类型 | 默认值 | 描述 |
---|---|---|---|
无参数 | |||
返回值 | 类型 | 描述 | |
this | SourceComponent |
Inherited Events
multiTreeView.$on('select')
选择某一项时触发
属性 | 类型 | 描述 |
---|---|---|
sender | object | 事件发送对象 |
selected | object | 当前选择项 |
multiTreeView.$on('toggle')
展开或收起某一项时触发
属性 | 类型 | 描述 |
---|---|---|
sender | object | 事件发送对象 |
item | object | 处理项 |
open | boolean | 展开/收起状态 |