Vue.js在数组中观察嵌套属性

Question

我有一个像这样的vue对象:

var vm = new Vue({
            el: '#app',
            data: {
                items: [],
                index: 0
            },

            });

内部项目数组我将推送项目,如:

item1 = {
    a: 1,
    b: 'type',
    c: '3.556'
}
...
itemN = {
    a: n,
    b: 'type',
    c: '5.226'
}

然后我会更新项目的"c"属性之一,我想设置一个观察者,一旦这个属性发生变化就会发出警告.

编辑:我也想知道女巫项目已经改变

Answer 1

您可以使用深度监视，但是......它没有提供简单的方法来确定哪个项目已更改。

...
watch: {
  items: {
    handler: function (val, oldVal) {

    },
    deep: true
  }
}
...

这个答案中提到了一种可能的解决方法，该解决方案背后的想法是将每个项目包装在组件中并监听来自组件的事件。

您还可以存储克隆项目数组并在监视处理程序中更新该克隆，您可以使用该克隆来过滤已更改的项目。