Question

我是VueJs的新手，我正在研究一种仅在模型发生更改时才启用Save按钮的表单。

我最初的想法是compute比较初始模型和当前模型的肮脏函数。

注意：该代码未经测试，此处仅作为示例。

var app = new Vue({
    el: '#app',
    data: {a:0, b:'', c:{c1:null, c2:0, c3:'test'}},
    initialData: null,
    mounted():{ initialData = JSON.parse(JSON.stringify(data));},
    computed: {
        isDirty: function () {
          return JSON.stringify(data) === JSON.stringify(initialData) 
        }
    }
});

是否有更好的方法可以做到？您是否可以对上述代码提出任何改进建议？

Answer 1

您可以使用manual所示的deep的{{1}}选项

watch

Answer 2

从-> https://stackoverflow.com/a/48579303/4050261

借用

您可以在父容器上绑定单个onchange事件，并受益于更改事件冒泡的事实：

<div class="container" @change="someThingChanged()">
  <input v-model="foo">
  <input v-model="bar">
  ... etc.
</div>

如何在VueJs中实现脏状态

2 个答案: