【VUE】 父组件参数更新,子组件watch监听参数不刷新

【VUE】 父组件参数更新,子组件watch监听参数不刷新


总结常见不刷新有三个原因,如下:

1、原因:监听的参数为对象,可能因为没有深度监听
解决:deep:true,为了发现对象内部值的变化,可以在选项参数中指定 deep: true 。注意监听数组的变动不需要这么做。

watch:{
 data: {           // data为监听参数名
     handler: function (val, oldVal) { /* ... */ },
     deep: true
 }
}

2、原因:如果发现参数监听偶尔可以,那么查一下子组件是否用了v-if,v-if每次不展示就会销毁,展示时重新添加dom节点
解决:把v-if改成v-show,或者可以在监听里面加上immediate: true这项,在选项参数中指定 immediate: true 将立即以表达式的当前值触发回调,这样在首次赋值的时候也会触发watch里面的handler事件,写法如下:

watch:{
 data: {           // data为监听参数名
     handler: function (val, oldVal) { /* ... */ },
     immediate: true
 }
}

3、原因:Vue.js 不能检测到对象属性的添加或删除
解决:通过this.$set(object, key, value)来进行对象的操作

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值