ExtJS-Data Package (数据处理包) TreeModel类型

更新记录
2022年7月13日 发布。
2022年7月6日 从笔记迁移到博客。

ExtJS教程汇总：https://www.cnblogs.com/cqpanda/p/16328016.html

Ext.data.TreeModel（树型模型）

说明#

Ext.data.TreeModel用于表示树型模型
Ext.data.TreeModel继承自Ext.data.Model
常用于配合Ext.data.TreeStore使用

实例：定义TreeModel#

//定义TreeModel
Ext.define('BizDash.model.NavigationItem', {
    extend: 'Ext.data.TreeModel',  //继承自TreeModel
    fields: [   //定义字段
        { name: 'Label', type: 'string' },
        { name: 'Route', type: 'string' }
    ]
});

实例：添加子节点#

appendChild: This adds the specified node(s) as the last child of the current node

//定义TreeModel
Ext.define('BizDash.model.NavigationItem', {
    extend: 'Ext.data.TreeModel',  //继承自TreeModel
    fields: [   //定义字段
        { name: 'Label', type: 'string' },
        { name: 'Route', type: 'string' }
    ]
});

//定义TreeModel的实例
var treeModelInstance = Ext.create('BizDash.model.NavigationItem');

//添加子节点
treeModelInstance.appendChild({
    Label: 'Orders',
    Route: '/orders'
});

//添加子节点(多个)
treeModelInstance.appendChild([{
    Label: 'Orders',
    Route: '/orders'
},{
    Label: 'First',
    Route: '/first'
}]);

实例：插入子节点#

insertChild: This inserts the new node at the specified position

//定义TreeModel
Ext.define('BizDash.model.NavigationItem', {
    extend: 'Ext.data.TreeModel',  //继承自TreeModel
    fields: [   //定义字段
        {
            name: 'Label',
            type: 'string'
        },
        {
            name: 'Route',
            type: 'string'
        }
    ]
});
//定义TreeModel的实例
var treeModelInstance = Ext.create('BizDash.model.NavigationItem');
//插入子节点
treeModelInstance.insertChild(0,{
    Label: 'First',
    Route: '/first'
});

实例：移除子节点#

removeChild: This removes the specified node from the child collection
//定义TreeModel
Ext.define('BizDash.model.NavigationItem', {
    extend: 'Ext.data.TreeModel',  //继承自TreeModel
    fields: [   //定义字段
        {
            name: 'Label',
            type: 'string'
        },
        {
            name: 'Route',
            type: 'string'
        }
    ]
});

//定义TreeModel的实例
var treeModelInstance = Ext.create('BizDash.model.NavigationItem');

//添加子节点
treeModelInstance.appendChild({
    Label: 'Orders',
    Route: '/orders'
});

//插入子节点
treeModelInstance.insertChild(0,{
    Label: 'First',
    Route: '/first'
});

//查找节点
var node = treeModelInstance.findChild('Label', 'First', true);
//移除子节点
treeModelInstance.removeChild(node);

实例：遍历子节点#

eachChild: This executes a function on each of the child nodes

//定义TreeModel
Ext.define('BizDash.model.NavigationItem', {
    extend: 'Ext.data.TreeModel',  //继承自TreeModel
    fields: [   //定义字段
        {
            name: 'Label',
            type: 'string'
        },
        {
            name: 'Route',
            type: 'string'
        }
    ]
});

//定义TreeModel的实例
var treeModelInstance = Ext.create('BizDash.model.NavigationItem');

//添加子节点(多个)
treeModelInstance.appendChild([{
    Label: 'Orders',
    Route: '/orders'
},{
    Label: 'First',
    Route: '/first'
}]);

//遍历子节点
treeModelInstance.eachChild(function(child){
    console.log(child);
});

实例：查找子节点#

findChild: This finds the first child that matches the given property/value given

//定义TreeModel
Ext.define('BizDash.model.NavigationItem', {
    extend: 'Ext.data.TreeModel',  //继承自TreeModel
    fields: [   //定义字段
        {
            name: 'Label',
            type: 'string'
        },
        {
            name: 'Route',
            type: 'string'
        }
    ]
});
//定义TreeModel的实例
var treeModelInstance = Ext.create('BizDash.model.NavigationItem');
//查找节点
var node = treeModelInstance.findChild('Label', 'First', true);

实例：检测是否叶子节点#

isLeaf: This determines if the current node is a leaf without any further children

//定义TreeModel
Ext.define('BizDash.model.NavigationItem', {
    extend: 'Ext.data.TreeModel',  //继承自TreeModel
    fields: [   //定义字段
        {
            name: 'Label',
            type: 'string'
        },
        {
            name: 'Route',
            type: 'string'
        }
    ]
});

//定义TreeModel的实例
var treeModelInstance = Ext.create('BizDash.model.NavigationItem');

//添加子节点(多个)
treeModelInstance.appendChild([{
    Label: 'Orders',
    Route: '/orders'
},{
    Label: 'First',
    Route: '/first'
}]);

//检测是否叶子节点
var node = treeModelInstance.findChild('Label', 'First', true);
console.log(node.isLeaf()); //false