javascript - Vue中，如何watch数组中所有对象的某个属性的变化？

问题描述

问 题

      items: [
        {
          id: 336,
          title: '智利三文鱼扒500g酸甜口味爆炒',
          img: '../assets/images/test/8-1.jpg',
          count: 1,
          price1: 106,
          price2: 80
        },
        {
          id: 337,
          title: '西班牙三文鱼扒500g酸甜口味爆炒',
          img: '../assets/images/test/8-1.jpg',
          count: 2,
          price1: 225,
          price2: 152
        }
      ]

如上代码，我要求count的和，当任意count的值产生变化是，就要更新count的和，请问如何监听所有count的值得变化呢？

---

感谢大神们的回答，不过我的问题是如何监听所有count值得变化？以便触发下一步操作

解决方案

用计算属性，返回值是这个列表值相加

computed: {
    countTotal: function () {
        let total = 0;
        this.items.forEach(function (item) {
            total += item.count
        })
        return total
    }
}

监听用 watch选项

watch: {
    items: {
        handler: function () {},
        deep: true
    }
}

对象要深复制，默认是浅复制

这篇关于javascript - Vue中，如何watch数组中所有对象的某个属性的变化？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！