問題描述

成都創(chuàng)新互聯(lián)為企業(yè)級客戶提高一站式互聯(lián)網(wǎng)+設(shè)計(jì)服務(wù)，主要包括成都網(wǎng)站建設(shè)、網(wǎng)站建設(shè)、App定制開發(fā)、小程序定制開發(fā)、宣傳片制作、LOGO設(shè)計(jì)等，幫助客戶快速提升營銷能力和企業(yè)形象，創(chuàng)新互聯(lián)各部門都有經(jīng)驗(yàn)豐富的經(jīng)驗(yàn)，可以確保每一個(gè)作品的質(zhì)量和創(chuàng)作周期，同時(shí)每年都有很多新員工加入，為我們帶來大量新的創(chuàng)意。 

Vue提供了一個(gè)watch方法可以讓使用者去監(jiān)聽某些data內(nèi)的數(shù)據(jù)變動，觸發(fā)相應(yīng)的方法，比如

 queryData: {
   name: '',
   creator: '',
   selectedStatus: '',
   time: [],
 },

第一種解決方案：直接對象

現(xiàn)在我需要監(jiān)聽這個(gè)queryData，我可以這樣做：

watch: {
   queryData: {
     handler: function() {
      //do something
     },
     deep: true
   }
}

第二種解決方案：deep

里面的deep設(shè)為了true，這樣的話，如果修改了這個(gè)queryData中的任何一個(gè)屬性，都會執(zhí)行handler這個(gè)方法。不過其實(shí)這樣開銷是蠻大的，尤其是對象里面結(jié)構(gòu)嵌套過深的時(shí)候。而且有時(shí)候我們就想關(guān)心這個(gè)對象中的某個(gè)屬性，比如name，這個(gè)時(shí)候可以這樣

watch: {
   'queryData.name': {
     handler: function() {
      //do something
     },
   }
}

第三種解決方案：（computed+watch）

或者還可以這樣巧用計(jì)算屬性

computed: {
  getName: function() {
    return this.queryData.name
  }
}
watch: {
   getName: {
     handler: function() {
      //do something
     },
   }
}

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持創(chuàng)新互聯(lián)。