道场树刷新答案

【问题标题】：Dojo Tree Refresh道场树刷新
【发布时间】：2009-04-06 22:34:16
【问题描述】：

使用 Dojo 1.3，在将子项（即文件夹或项）添加到树后，有没有办法通过刷新或其他方法立即反映它？

【问题讨论】：

【解决方案1】：

更新树

人们经常问：

如何更新树（添加或删除项目？）

您无法更新直接树，而是你需要更新模型。通常模型是连接到数据存储并在其中如果您需要更新数据店铺。因此，您需要使用数据允许更新的商店（通过它是官方 API），比如 dojo.data.ItemFileWriteStore.

如何从商店？

这不受支持。店铺需要通知任何树数据的变化。目前这是真的只支持（开箱即用）通过 dojo.data.ItemFileWriteStore，作为设置客户端-服务器 dojo.data 服务器通知的来源数据发生变化时的客户端相当复杂，超出了 dojo 的范围，仅限客户端解决方案。

【讨论】：

【解决方案2】：

假设，如果您的模型有查询 `{type:'continent'} - 意味着具有此属性的任何项目都是顶级项目，那么以下模型扩展将监控更改并刷新树的视图

var dataStore = new ItemFileWriteStore( { ... });
new Tree({
  store: dataStore,
  model: new ForestModel({
    onNewItem: function(item, parentInfo){
        if(this.store.getValue(item, 'type') == 'continent'){
            this._requeryTop();
        }
        this.inherited(arguments);
    }
  }
});

这应该反过来调用树中的childrenChanged，并在每次添加新项目时更新它。

见model reference

作为补充，如果添加的项目不是顶级项目，则应使用此语句立即更新。 parent 是在其children 中添加了一个项目的树节点。

tree._collapseNode(parent);
parent.state = 'UNCHECKED';
tree._expandNode(parent);

树的或多或少“标准”刷新可以通过以下来实现。我认为它没有被添加到基本实现的原因是因为它会破坏与树上 DnD 功能的链接

dojo.declare("My.Tree", [dijit.Tree], {

           // Close the store? (So that the store will do a new fetch()).
         reloadStoreOnRefresh : true, 

         update: function() {
            this.model.store.clearOnClose = this.reloadStoreOnRefresh;
            this.model.store.close();

            // Completely delete every node from the dijit.Tree
            delete this._itemNodesMap;
            this._itemNodesMap = {};
            this.rootNode.state = "UNCHECKED";
            delete this.model.root.children;
            this.model.root.children = null;

            // Destroy the widget
            this.rootNode.destroyRecursive();

            // Recreate the model, (with the model again)
            this.model.constructor(this.model)

            // Rebuild the tree
            this.postMixInProperties();
            this._load();
         }
      }
);

【讨论】：

badhorsie 使用的是 1.3。这可能与您使用哪种类型的商店有关

【解决方案3】：

我已经解决了这个问题，不需要刷新。

_refreshNodeMapping: function (newNodeData) {

    if(!this._itemNodesMap[newNodeData.identity]) return;

    var nodeMapToRefresh = this._itemNodesMap[newNodeData.identity][0].item;
    var domNode = this._itemNodesMap[newNodeData.identity][0].domNode;

    //For every updated value, reset the old ones
    for(var val in newNodeData)
    {
        nodeMapToRefresh[val] = newNodeData[val];

        if(val == 'label')
        {
            domNode.innerHTML = newNodeData[val];
        }
    }  
}

【讨论】：