Vue3 中 reactive 接收基础数据类型为何会响应式？

一分耕耘，一分收获！既然都打开这篇《Vue3 中 reactive 接收基础数据类型为何会响应式？ 》，就坚持看下去，学下去吧！本文主要会给大家讲到等等知识点，如果大家对本文有好的建议或者看到有不足之处，非常欢迎大家积极提出！在后续文章我会继续更新文章相关的内容，希望对大家都有所帮助！

Vue3 中 reactive 响应基础数据类型的疑惑

在 Vue3 中，使用 reactive 和 ref 创建变量时，会出现一些令人疑惑的情况：

reactive 接收基础数据类型也会响应式？

按照官方的说法，reactive 只能代理对象。但是，在一个例子中，reactive 接收了一个数字作为参数，并且界面上的数字会随着定时器的调用而响应式变化。

为什么去掉 ref 后 reactive 就不会响应式了？

当在上述例子中移除 ref 创建的变量时，reactive 将不再响应式。

解释

虽然 reactive 接收了基础数据类型，但它实际上并没有使该数据类型成为响应式的。这是因为 Vue3 的依赖收集是以组件为单位的。

当创建 ref 对象时，该对象是一个响应式对象。因此，更新 ref 时的依赖收集会将 render 函数收集为其依赖项。

当 ref 更新后，触发更新依赖，导致 render 重新运行。在 diff 算法中，除了更新 ref 本身，也会更新其他变化的响应式对象，例如 reactive。

因此，reactive 并不是真正的响应式，而是恰好在 ref 更新时被捎带更新了。

本篇关于《Vue3 中 reactive 接收基础数据类型为何会响应式？ 》的介绍就到此结束啦，但是学无止境，想要了解学习更多关于文章的相关知识，请关注golang学习网公众号！