在Vue.js中可以使用雙向數據綁定嗎？

Question

我有以下代碼：

<div id="app"> 
    {{ message }} 
</div> 

JS：

myObject = {message:"hello"} 

new Vue({ 
    el: '#app', 
    data: myObject 
}) 

當myObject.message更新時，DIV內容也被更新。現在當我更新div內容時，用jQuery例如：

$('#myapp').html('world'); 

該對象未更新。我也嘗試將v-model =「message」設置爲div，但也不會更新。是否可以綁定數據而不將其附加到輸入元素？

Answer 1

您與Vue的合同是您將使用viewmodel，而Vue會保持與DOM同步。

如果Vue公司不提供這類行爲你需要，你告訴Vue公司如何做你想要什麼，用指令，組件擴展它，等

所以在原則上，你可以有一個指令，使用MutationObserver來注意什麼時候你已經替換了一塊DOM，並且對你的視圖模型做了些什麼。由於Vue本身提供了修改DOM內容的更好結構化方式，因此幾乎肯定是一個糟糕的主意。雙向綁定旨在處理用戶與DOM的交互，而不是程序員對其的修改。 Vue的美妙之處在於你不必亂搞DOM。