在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ 在vue中為什么可以通過computed屬性作為中間件,去監(jiān)聽對(duì)象屬性的變化

在vue中為什么可以通過computed屬性作為中間件,去監(jiān)聽對(duì)象屬性的變化

<template>
  <div>
    <!-- el實(shí)現(xiàn) -->
    <el-form>
      <el-form-item label="相關(guān)人員">
        <el-select class="filter-item" multiple v-model="forms.teamuser" placeholder="請(qǐng)選擇相關(guān)人員" style="width: 100%;">
          <el-option v-for="(item,index) in forms.messageuser" :key='index' :label='item' :value='index'>
          </el-option>
        </el-select>
      </el-form-item>
    </el-form>

  </div>
</template>
<script>
  export default{
    data(){
      return{
       forms:{
         teamuser:'區(qū)域1',
         messageuser:['區(qū)域1','區(qū)域2','區(qū)域3']
       }, 
    }
    },
    //深度監(jiān)聽對(duì)象屬性變化
    computed:{
      teamuser(){
        console.log(this.forms.teamuser)
        return this.forms.teamuser        
      }
    },
    watch:{
      teamuser(){
        console.log('watch方法執(zhí)行了'+this.forms.teamuser)        
      }
    }
  }
</script>



如上代碼,為什么computed屬性可以作為watch的中間件,從而實(shí)現(xiàn)可以監(jiān)聽對(duì)象forms的teamuser屬性

回答
編輯回答
膽怯
  1. watch可以監(jiān)聽vue實(shí)例的data和props
  2. computed屬性的處理是和data一樣的
2017年3月29日 22:19
編輯回答
舊顏

data的時(shí)候,對(duì)其中的每個(gè)存在的值會(huì)進(jìn)行深度遍歷,創(chuàng)建dep。
computed的時(shí)候會(huì)分析其中的值,然后把computed添加到了依賴值的dep通知隊(duì)列里。
這樣每次this.forms.teamuser變的時(shí)候就會(huì)通知teamuser該執(zhí)行了。

2018年7月18日 14:44