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，并对你的viewmodel做了些什么。由于Vue本身提供了更好结构的修改DOM内容的方法，因此几乎肯定是一个坏主意。双向绑定旨在处理用户与DOM的交互，而不是程序员对它的修改。 Vue的美妙之处在于你不必乱用DOM。

是否可以在Vue.js中使用输入元素进行双向数据绑定？

1 个答案: