码迷,mamicode.com
首页 > 其他好文 > 详细

vue 解决双向绑定中 父组件传值给子组件后 父组件值也跟着变化的问题

时间:2019-03-20 17:08:30      阅读:173      评论:0      收藏:0      [点我收藏+]

标签:修改   说明   strong   vue   通过   哈哈   对象   绑定   双向   

说明:

近日开发中碰见一个很诡异的问题,  父组件动态的修改对象 data 中的值, 然后将这个对象 data 传给子组件, 子组件拿到后将 data 中的值 乘以 100 ,发现父组件中的值也跟着变化了,通过查阅资料,发现 是 VUE 双向绑定中的一个bug,就此给出解决办法,亲测有效

 

情景描述:

对象  data = {

  price: 0,

  flag: true,

  name: " 哈哈 "

}

父组件 更改 data.parice = 100,   然后将 data对象 传给子组件, 子组件接收到对象data ,  将data.price * 100,  接口调用完成后, 父组件中的data.price 变成了   10000;

 

解决办法:

1、不给子组件传对象,传个子组件单独的一个 price 值;

2、可以传对象 data, 需要将 data 处理,  JSON.parse(JSON.stringify(data ))  两次转换后就解决了该问题;

 

vue 解决双向绑定中 父组件传值给子组件后 父组件值也跟着变化的问题

标签:修改   说明   strong   vue   通过   哈哈   对象   绑定   双向   

原文地址:https://www.cnblogs.com/aoqizhonghua/p/10565988.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!