Vue3 reactive丢失响应式问题

编程语言 2023-08-01 18:01:33 阅读次数: 0

文章目录

出现问题
解决方法

出现问题

我们定义一个 a 并用reactive将其变为响应式数据
然后在 ‘getCategory2’ 方法中将data赋值给 a
在这里插入图片描述
打印赋值前的a赋值后的a可以看到

赋值前的a是proxy对象，即拥有响应式
复制后的a变成普通对象，所以失去响应式

解决方法

使用 reactive 定义数据时，使用对象包含键值对的形式，那么就会避免重新赋值的问题
在这里插入图片描述
像这样定义a，赋值也不会失去响应式

在这里插入图片描述
可以看到赋值前赋值后都是proxy对象，所以没有失去响应式

猜你喜欢

转载自blog.csdn.net/Cuichenyang158/article/details/131974926

Vue3 reactive丢失响应式问题

避大坑！Vue3中reactive丢失响应式的问题

vue3 ref reactive响应式数据赋值的问题

Vue3中reactive响应式失效的问题

vue3，对象重新赋值后，reactive 丢失响应式，而 ref 不会

vue3的reactive函数实现响应式

vue3 响应式数据库—— reactive

Vue3 的 Reactive 响应式到底是什么

Vue3响应式API-reactive的数组代理

VUE3响应式数据（ref和reactive)

vue3对一个reactive对象重新赋值失去响应式问题

vue3 遇到 reactive响应式失效问题记录

Vue3的响应式

vue3 ---＞ setup() 用法响应式API - reactive 响应式API - ref

解决在vue3中使用reactive响应式，赋值后造成页面不改变的问题？

【vue3】优雅的解决reactive()响应式对象初始化重新赋值问题v2

Vue3 的 ref 和 reactive 问题

vue3 中的 ref、reactive和v3响应式原理

vue3 reactive的坑

vue3之reactive

【vue3】reactive与ref

vue3响应式模块的实现 efffect reactive ref...

vue3 reactive值为什么不推荐解构&&分析响应式结构

Vue3的组合API——setup、响应式实现（ref、reactive）

vue3 ref及reactive响应式原理案例语法糖/非语法糖

Vue3中响应式 API ( reactive、ref、toRef、toRefs ) 详解

Vue3——第四章（响应式基础：reactive、ref）

浅析vue3中的声明响应式数据 ref 和 reactive

Vue3响应式原理分析（reactive，ref，computed底层实现）

vue3中的包装响应式数据ref、reactive、toRef、toRefs

今日推荐

火速冲上 GitHub 热榜 —— 开源编程语言、框架哪有这么可爱？

北京人形机器人创新中心发布全球首个纯电驱拟人奔跑的全尺寸人形机器人“天工”

LFOSSA 源来如此公开课 | 掌握云原生未来：CNCF 认证全面攻略与备考秘籍

国产云输入法——仅华为无云端数据上传安全问题

开源日报 | 工业开源项目OGG 1.0；姐姐，你要和我一起配置火狐吗；苹果AI遥遥落后？Fedora 40

开放签电子签章：停止新增，优化体验，前进更进（五一假期前工作）

开源日报 | 中学生开源前端动画引擎；全球首个Llama3 8B中文版开源模型；联想电脑恐出局；Linus讽刺AI炒作

周排行

浏览器对同一域名进行请求的最大并发连接数

React Hook之自定义Hook

【转】MyBatis缓存机制

-Java-泛型

自动化测试常用脚本-发送邮件

LeetCode#859: Buddy Strings

java、Python处理字符串

第二篇の博客

Hadoop伪分布式环境安装

SQL Server进阶（十一）临时表、表变量

每日归档

更多

2024-04-27(56)

2024-04-26(39)

2024-04-25(22)

2024-04-24(36)

2024-04-23(26)

2024-04-22(39)

2024-04-21(0)

2024-04-20(6)

2024-04-19(5)

2024-04-18(0)