在extjs中如何使用ExtdataTreeStore
Ext.data.TreeStore是ExtJS中用于处理树形数据的数据存储类。使用Ext.data.TreeStore可以方便地管理树形数据,实现增删改查等操作。
下面是一个使用Ext.data.TreeStore的示例:
Ext.create('Ext.data.TreeStore', {
storeId: 'myTreeStore',
root: {
text: '根节点',
expanded: true,
children: [
{
text: '子节点1',
leaf: true
},
{
text: '子节点2',
expanded: true,
children: [
{
text: '子节点2.1',
leaf: true
},
{
text: '子节点2.2',
leaf: true
}
]
}
]
}
});
上述代码中,我们创建了一个名为“myTreeStore”的Ext.data.TreeStore实例,该实例包含一个根节点,根节点下包含两个子节点,其中一个子节点下又包含两个子节点。
通过调用store的方法,我们可以对树形数据进行增删改查等操作。例如:
// 获取根节点
var rootNode = Ext.getStore('myTreeStore').getRootNode();
// 添加子节点
var newNode = rootNode.appendChild({
text: '子节点3',
leaf: true
});
// 删除子节点
rootNode.removeChild(newNode);
// 更新节点文本
rootNode.set('text', '新的根节点名称');
// 根据节点ID获取节点对象
var node = Ext.getStore('myTreeStore').getNodeById('nodeId');
// 根据节点路径获取节点对象
var node = Ext.getStore('myTreeStore').getNodeById('/root/child1');
// 遍历树形数据
rootNode.cascadeBy(function(node) {
console.log(node.get('text'));
});
除了上述基本操作,Ext.data.TreeStore还提供了许多其他方法和事件,可以根据实际需求进行使用。
原文地址: https://www.cveoy.top/t/topic/0ML 著作权归作者所有。请勿转载和采集!