在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。