欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Vue利用computed配合watch實現(xiàn)監(jiān)聽多個屬性的變化

 更新時間：2023年10月24日 09:12:56   作者：JackieDYH  
這篇文章主要給大家介紹了在Vue中巧用computed配合watch實現(xiàn)監(jiān)聽多個屬性的變化的方法,文中有詳細(xì)的代碼示例供大家參考,具有一定的參考價值,需要的朋友可以參考下

但需要同時監(jiān)聽多個值的變化時，原始操作是通過去對每個屬性進(jìn)行監(jiān)聽，

props: ['id', 'data', 'name', 'period', 'unit'],

因為watch可以監(jiān)聽計算屬性computed，可以通過computed把所有要監(jiān)聽的數(shù)據(jù)組成對象，再去監(jiān)聽該對象需要監(jiān)聽的數(shù)據(jù)逐個寫，這樣重復(fù)的代碼很多，不推薦這里想要實現(xiàn)的功能是，數(shù)據(jù)改變了，比對name1和name2是否一致，顯示巧用computed更勝一籌

原始方法

watch: {
    data: {
      handler() {
        if (this.chart) {
          this.setOption();
        }
      },
      deep: true,
      immediate: false
    },
    period: {
      handler() {
        if (this.chart) {
          this.setOption();
        }
      },
      deep: true,
      immediate: false
    }
  }

computed

computed: {
    chartData() {
      const {data, name, period, unit} = this
      return{
        data, name, period, unit
      }
    }
  },
  watch: {
    chartData: {
      handler(newVal, oldVal) {
        if (this.chart) {
          this.setOption();
        }
      },
      deep: true,
      immediate: false
    }
  },

到此這篇關(guān)于Vue利用computed配合watch實現(xiàn)監(jiān)聽多個屬性的變化的文章就介紹到這了,更多相關(guān)Vue computed現(xiàn)監(jiān)聽屬性變化內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

相關(guān)文章

最新評論