流星避免雙刷新當第三方小部件改變它自己的反應性數據源

Question

我有一個jsTree，我試圖雙向「連接」到一個流星集合。

FileTree.find().observeChanges({ 
    added: function() { 
    $.jstree.reference('#fileTree').refresh(); 
    }, 
    changed: function() { 
    $.jstree.reference('#fileTree').refresh(); 
    }, 
    removed: function() { 
    $.jstree.reference('#fileTree').refresh(); 
    } 
}); 

我想在jsTree拖動周圍的東西，使數據庫的編輯：每當採集與更新的.observeChanges幫助下現在我自動觸發jsTree.refresh()。以下是它的外觀：

1. 用戶將元素拖放到新位置。
2. jsTree更新樹中元素的位置。
3. jsTree調用事件處理程序
4. 事件處理程序的更新數據庫

我的問題是，如果我沒有理解錯的一切，是數據庫更新將觸發observeChanges事件，我先前設置。這會導致樹的又一次刷新。這會導致惱人的閃爍，從而中斷用戶。 （即在每次拖放操作之後，文件瀏覽器將無法使用0.75秒左右）。

我該如何防止這種不必要的更新，或者是否有更好的方法來構建我的界面以防止出現此問題的jsTree。

Answer 1

你見過這個嗎？

• https://github.com/tobkle/meteor-jstree-example
• https://github.com/tobkle/meteor-jstree

看起來他/她正在使用autorun與observeChanges但大多是相同的概念你：

Template.showtree.rendered = function(){ 

    var self = this; 
    var nodes = []; 

    Nodes1 = $('#tree1').tree(); 
    Nodes2 = $('#tree2').tree(); 

    if (!self.handle){ 
    self.handle = Meteor.autorun(function(){ 
     // refresh trees on new data 
     nodes = Nodes.find(); 
     Nodes1.tree('option', 'data', 'Projects'); 
     Nodes2.tree('option', 'data', 'Contexts'); 
    }); //self.handle 
    } // if (!self.handle) 
} 

如果這是唯一的東西一個用戶會編輯（一次），那麼也許你只是不刷新它基於數據庫更新，並將樹作爲僅作者的接口。

如果需要根據數據庫更新刷新（來自其他用戶，或者只是保持同步），你可能會考慮更改您的工作流程/邏輯：

1. 的changed.jstree事件，本地更新數據庫，阻斷
2. 的autorun觸發jstree刷新

應，在理論上，只有導致1刷新對2或3

或者如果你真的想限制重新繪製...你可以找到舊的父節點和新的父節點，只有我們refresh_node(obj)刷新只是這些變化的節點：

refresh_node (obj)

刷新一個節點樹（重新加載其子女）所有該節點內部的已打開節點 將重新加載對load_node的調用。