0
0
花韻仙語
发布时间：2024-11-01 19:56:29
|1110人浏览过
|来源于php中文网
原创
vue3 中 reactive 接收基础数据类型不会响应式
在 Vue3 中，使用 reactive 创建响应式变量时，如果传入的是基础数据类型（如数字、字符串），尽管控制台会提示警告“value cannot be made reactive”，但界面的显示仍然会随着时间的推移而改变。这个问题让人感到困惑，尤其是在我们没有同时使用 ref 创建响应式对象时。
其实，reactive 本质上只支持代理对象。尽管我们传入的是基础数据类型，reactive 会自动创建一个封装它的对象。但是，这个对象并不是真正的响应式对象。真正的响应式对象需要使用 ref 创建。
当我们同时使用 ref 定义的变量时，reactive 创建的变量也会响应式更新。这是因为 ref 创建的变量是一个响应式对象，vue3 的依赖收集是以组件为单位的。因此，render 函数会收集对 msgRef 的依赖。当 msgRef 更新后，会触发更新依赖，导致 render 函数重新执行。基于 diff 算法，它会找出需要更新的部分。此时，msgReactive 只是恰好也更新了，而已搭上了 msgRef 的顺风车。
相关文章
html5 vue 如何开发_HTML5与Vue.js开发整合步骤与技巧【指南】
HTML如何实现自动翻页_无限滚动加载技术【指南】
解决 Vue-select 选中值不显示问题：深入理解 Vue 响应式原理
在Vue中实现Chart.js折线图的动态数据更新
解决JavaScript中动态生成DOM元素查询为空的问题
本站声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
热门AI工具
相关专题
js字符串转数组的方法：1、使用“split()”方法；2、使用“Array.from()”方法；3、使用for循环遍历；4、使用“Array.split()”方法。本专题为大家提供js字符串转数组的相关的文章、下载、课程内容，供大家免费下载体验。
246
2023.08.03
js截取字符串的方法有substring()方法、substr()方法、slice()方法、split()方法和slice()方法。本专题为大家提供字符串相关的文章、下载、课程内容，供大家免费下载体验。
202
2023.09.04
java基础知识有Java的历史和特点、Java的开发环境、Java的基本数据类型、变量和常量、运算符和表达式、控制语句、数组和字符串等等知识点。想要知道更多关于java基础知识的朋友，请阅读本专题下面的的有关文章，欢迎大家来php中文网学习。
1428
2023.10.24
字符串是一种数据类型，它可以是任何文本，包括字母、数字、符号等。字符串可以由不同的字符组成，例如空格、标点符号、数字等。在编程中，字符串通常用引号括起来，如单引号、双引号或反引号。想了解更多字符串的相关内容，可以阅读本专题下面的文章。
606
2023.11.24
Java8引入了新的文件I/O API，使用java.nio.file.Files类读取文件内容更加方便。对于较旧版本的Java，可以使用java.io.FileReader和java.io.BufferedReader来读取文件。在这些方法中，你需要将文件路径替换为你的实际文件路径，并且可能需要处理可能的IOException异常。想了解更多java的相关内容，可以阅读本专题下面的文章。
546
2024.03.22
苹果官网直接访问入口是https://www.apple.com/cn/，该页面具备0.8秒首屏渲染、HTTP/3与Brotli加速、WebP+AVIF双格式图片、免登录浏览全参数等特性。本专题为大家提供相关的文章、下载、课程内容，供大家免费下载体验。
10
2025.12.24
热门下载
相关下载
精品课程
最新文章
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
