父组件监听本地vuex中的数据，然后传递给子组件，子组件也要监听才能变化

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51

//父组件 <heart-wear-connection :isShouhuan="isShouhuan"></heart-wear-connection> watch: {         getwear: function(a, b) {             console.log("修改后为：" + a);             if(a === 'y'){                 this.$nextTick(function(){                     this.isShouhuan = true                 })             }else{                 this.$nextTick(function(){                     this.isShouhuan = false                 })             }         }     },     computed:{         getwear() {             return this.$store.state.ifLinkWatchSuccess         }     },       子组件 <view style="font-size: 26upx;padding-top: 10upx;color: #999999;" v-if="!isShouhuan1">                 未连接             </view>             <view style="font-size: 26upx;padding-top: 10upx;color: #30D969;" v-else>                 已连接             </view>           props: {             isShouhuan: {                 default: true,                 type: Boolean             }         },         watch: {             isShouhuan: {                 immediate: true,    // 这句重要                 handler (val) {                   this.isShouhuan1=val                 }             }         },         data() {             return {                 isShouhuan1: this.isShouhuan,             }         },

　　使用watch时有一个特点，就是当值第一次绑定的时候，不会执行监听函数，只有值发生改变才会执行。如果我们需要在最初绑定值的时候也执行函数，则就需要用到immediate属性。

比如当父组件向子组件动态传值时，子组件props首次获取到父组件传来的默认值时，也需要执行函数，此时就需要将immediate设为true

watch 里面还有一个属性 deep，默认值是 false，代表是否深度监听
当需要监听一个对象的改变时，普通的watch方法无法监听到对象内部属性的改变，只有data中的数据才能够监听到变化，此时就需要deep属性对对象进行深度监听。