vue3 reactive,vue3 ref reactive

　　本文主要介绍了vue3中无功不能直接赋值的解决方案，具有很好的参考价值。希望对你有帮助。如有错误或不足之处，请不吝赐教。

vue3 reactive不能直接赋值

　　我最近很忙，没有太多时间学习。

　　在vue3中，ref和reacitve都可以定义响应数据，但它们是不同的。在使用reactive定义复杂结构的响应式数据时，如果要给它赋值，它就会失去响应性。那么赋值是我们经常做的一个操作，那么怎么解决呢？

方法

　　1.更改参考定义。

　　const arr=ref([])

　　数组值=[1，2，3]

　　2.推送新数据

　　const arr=reactive([])

　　数组推送(.[1, 2, 3])

　　3.再封装一层数据(推荐！)

　　恒定状态=反应({

　　arr: []

　　});

　　状态数组=[1，2，3]

　　但是在这种情况下，在html模板中，您必须使用数据来获取state.arr

　　所以我们可以用解构来回归。

　　但是被reactive解构的数据会失去响应性。

　　因此，使用torefs()方法来增加它们的响应性。

　　最终为：

　　恒定状态=反应({

　　arr: []

　　});

　　状态数组=[1，2，3]

　　返回{

　　.toRefs(州)，

　　}

vue3 reactive赋值不响应

　　我见过很多方法，先存起来。

（1）多嵌套一层

　　设置(道具){

　　//a赋值时，多一层对象值赋给A的属性A。

　　Let=reactive ({a: {ID: 1，name:小明 }})

　　目标

　　函数fn(){

　　//更改值时，可以直接将值赋给A.A。

　　A.a={id:2，姓名：黄啸 }

　　console . log(a)；

　　}

　　返回{

　　fn，a

　　}

（2）使用ref

　　const data=ref([])

　　数据值=[1，2，3]

（3）用obeject.assign

　　Let=reactive ({ID: 1，name:小明 })

　　函数fn(){

　　Object.assign(a，{id:2，name:大明 })

　　}

　　以上个人经历，希望能给大家一个参考，也希望大家多多支持我们。

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。