记录--vue父子组件传值,多层嵌套数组,父组件改变值子组件不更新问题(更新使用watch监听)

起因是父组件改变input绑定值时一直无效,打印数据却显示赋值成功,切换几次值又显示出来,尝试过watch监控也无效,最后找到这个方法后成功赋值,记录一下😑

let data = [
	{
		a: [
			{
              b: {value:''}
            }
         ]
    }
]
let obj = data[0].a[0].b;
obj.value = '测试';
data[0].a[0].b = obj;
this.infoData = Object.assign([], data);

补充:一定一定一定一定一定要注意类型!!!!!!看下图,我的infoData是数组类型但是我给的是对象,导致后面找BUG找够呛,一定要注意!
在这里插入图片描述
在这里插入图片描述
更新!!!!!!!!!!!!

根据最新经验,本人发现并不是因为watch不生效,而是我是用的方式不对😅,正确打开方式如下:

子组件:

props: {
    config: {
      type: Object, // 接收值为对象
      default: () => {
        return {};
      }
    }
  },
  watch: {
    config: {
      handler(newdata, oldName) {
        console.log(newdata)
      },
      immediate: true, // 一定要加
      deep: true // 一定要加!!!深度监听
    }
  },

父组件就不用多说了,这样父组件有改动子组件就会更新啦!!!!!!!!

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值