vue数据改变影响其他数据的问题

1,改变一个下拉框,其他几个下拉框的数据会跟着改变(这些下拉框都是使用的同一个数组不同对象的数据,非相同数据)

后面发现只有push添加的数据才会出现此问题
在这里插入图片描述

写死的数据下拉操作是正常的,不会影响其他对象的数据
在这里插入图片描述

解决:

生成一个新的对象或数组,就可以解决此问题
JSON.parse(JSON.stringify(“对象 || 数组”))

猜测是vue底层数据绑定的问题

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue中,当数据改变时,视图并不会立即更新。这是因为Vue采用了异步更新策略,也就是说,Vue会将数据的变化放入一个队列中,在下一个事件循环中批量更新视图。这样可以提高性能并避免频繁的视图更新。当数据发生改变时,Vue会触发一个更新队列,并在下一个事件循环中执行更新操作。 如果你想立即更新视图,可以使用Vue提供的$nextTick方法或者手动调用Vue的set方法来实现。$nextTick方法可以在Vue的更新队列被清空后执行一个回调函数,这样就可以保证在更新之后立即操作DOM。而Vue的set方法可以用来更新对象或数组的某一项的值,这样可以触发视图的更新。 例如,你可以使用以下代码来更新Vue中的数据并立即刷新数据: this.$set(this.dictOptions, 'isPublic', 1) // 更新对象 this.$set(this.model.roleList,this.selectKey,this.model.roleList[this.selectKey]) // 刷新数组 这样,当数据改变时,Vue会立即更新视图,显示最新的数据。 需要注意的是,直接设置数组的某一项的值虽然改变了数组的值,但视图上显示的仍为数组之前的值。这是因为直接修改数组的某一项并不会触发Vue的更新机制。为了解决这个问题,可以使用Vue的set方法,手动触发视图的更新,使其显示最新的数据。 总结来说,当Vue中的数据发生改变时,需要使用Vue提供的$nextTick方法或者手动调用Vue的set方法来更新视图,以保证数据的响应性。

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值