2017-03-27 68 views
0

我有2個JS對象,每個都在網頁中呈現爲Tree。「同步」Vue.js中的兩個JS對象

我的問題是如何在用戶對其他用戶應用更改時強制更改其中一個用戶。

我的基本想法是「綁定onChange」對每個對象顯然注意不要產生無限循環。

在jQuery中看起來很難,我讀了一些關於「代理」的內容,但我不明白它是否可以幫助我解決這個問題。

我最後想到vue.js.我讀過那個vue.js是非常高效的syncing js and dom objects所以它們之間的轉換幾乎很容易,也許有可能同步兩個js對象?


更清晰,這裏更多的細節:

我有這樣的事情:

let obj1={key1:1, key2:[1,2,3]}; // defines arbitrary data obj 
let obj2={}; 
$.extend(obj2,obj1); // defines obj2 as clone of obj1 

// do "something magic" here 

我想獲得如下:

obj1.key1=2; // => should automatically set obj2.key1=2; under the hood 
obj2.key2.push(4); // => should automatically set obj1.key2=[1,2,3,4] under the hood 

有什麼訣竅來綁定兩個(相同的,克隆的)數據對象,以便對其中一個進行的任何更改都會反映到另一個對象上,就像第e涉及對象鍵「指向」相同的數據?由於對象在JavaScript中分配的「引用」,這是可行的,如果我們定義了一個第三個對象「obj_value」,我們將其指定爲值以上對象如下:

obj1.key=obj_value; // both obj1.key and obj2.key point to the same object 
obj2.key=obj_value; 

,但我想更多的東西一般情況下,一個關鍵的obj直接綁定到另一個,在僞代碼

obj1.on('change',function(key,value) 
{ 
    obj2.key=value; 
}) 
+1

如果你使用計算屬性,你不必強制,你能提供關於這些對象是什麼樣子的更多細節,以便我可以在小提琴上解決它? –

回答

0
watch: { 
    objChangedByUser: function (value) { 
    this.cloneOfobjChangedByUser = Object.assign({}, value); 
    } 
} 

或者:

computed: { 
    cloneOfObjChangedByUser: function() { 
    return Object.assign({}, this.objChangedByUser); 
    } 
}