代码演示

基本形式

<multi.select source={source} value={value} on-select={this.selected($event)} />
选择的是：{value}
var component = new NEKUI.Component({
    template: template,
    data: {
        source: [
            {name: '节点1', id: 1, children: [
                {name: '节点1.1', id: 11},
                {name: '节点1.2', id: 12, children: [
                    {name: '节点1.2.1', id: 121, children: [
                        {name: '节点1.2.1.1', id: 1211, children: [
                            {name: '节点1.2.1.1.1', id: 12111},
                            {name: '节点1.2.1.1.2', id: 12112}
                            ]},
                        {name: '节点1.2.1.3', id: 1212},
                        {name: '节点1.2.1.3', id: 1213}
                        ]},
                    {name: '节点1.2.2', id: 122}
                ]},
                {name: '节点1.3', id: 13},
                {name: '节点1.4', id: 14},
            ]},
            {name: '节点2', id: 2},
            {name: '节点3', id: 3, children: [
                {name: '节点3.1', id: 31},
                {name: '节点3.2', id: 32}
            ]}
        ],
        value: ''
    },
    selected: function(event) {
        console.log(event);
    }
});

多选

<multi.select source={source} multiple={multiple} value={value}  on-select={this.selected($event)} />
选择的是：{value}
var component = new NEKUI.Component({
    template: template,
    data: {
        source: [
            {name: '节点1', id: 1, children: [
                {name: '节点1.1', id: 11},
                {name: '节点1.2', id: 12, children: [
                    {name: '节点1.2.1', id: 121, children: [
                        {name: '节点1.2.1.1', id: 1211, children: [
                            {name: '节点1.2.1.1.1', id: 12111},
                            {name: '节点1.2.1.1.2', id: 12112}
                            ]},
                        {name: '节点1.2.1.3', id: 1212},
                        {name: '节点1.2.1.3', id: 1213}
                        ]},
                    {name: '节点1.2.2', id: 122}
                ]},
                {name: '节点1.3', id: 13},
                {name: '节点1.4', id: 14},
            ]},
            {name: '节点2', id: 2},
            {name: '节点3', id: 3, children: [
                {name: '节点3.1', id: 31},
                {name: '节点3.2', id: 32}
            ]}
        ],
        value: '',
        multiple: true
    },
    selected: function(event) {
        console.log(event);
    }
});

API

Classes

TreeSelect

Events

“select 选择某一项时触发”

TreeSelect

Kind: global class
Extend: Select

new TreeSelect()

Param Type Default Description
[options.data] object = 绑定属性
[options.data.source] Array.<object> [] <=> 数据源
[options.data.source[].name] string => 每项的内容
[options.data.key] string "id" => 数据项的键
[options.data.nameKey] string "name" => 数据项的name键
[options.data.childKey] string "children" => 数据子项的键
[options.data.value] string null <=> 当前选择值
[options.data.selected] object <=> 当前选择项
[options.data.separator] string "," => 多选时value分隔符
[options.data.readonly] boolean false => 是否只读
[options.data.multiple] boolean false => 是否多选
[options.data.disabled] boolean false => 是否禁用
[options.data.visible] boolean true => 是否显示
[options.data.class] string => 补充class

“select 选择某一项时触发”

Kind: event emitted
Properties

Name Type Description
sender object 事件发送对象
selected object 当前选择项
← 表单项 单选组 →
想让文档更完善？ 来 GitHub 提个 PR 吧！