了解了对于 [Vue
3]{.mark} 中的响应式原理：我们通过对 [state]{.mark} 数据的响应式拦截，当触发 [proxy
setter]{.mark} 的时候，执行对应状态的 [effect]{.mark} 函数。接下来看一个经典的例子

我们说到了 [Reactive]{.mark} 会在 [proxy
getter]{.mark} 的时候收集 [effect]{.mark} 依赖，在 [proxy
setter]{.mark} 的时候触发 [effect]{.mark} 的执行。那么 [effect]{.mark} 副作用函数到底是个什么？以及是如何被收集起来的呢？

本文开启响应式原理的篇章，在开启这个篇章之前，我们先来了解一下 [Vue3]{.mark} 中一个基于 [Composition
API]{.mark} 响应式应用的例子是如何编写的

了解了关于新旧子节点不同为数组的情况下的更新过程，下面将接着上节的内容继续介绍如果子节点都是数组的情况，那么更新过程会变成什么样呢？

了解了数据访问代理的过程以及组件实例初始化的过程，接下来，我们将介绍组件的更新逻辑，这部分逻辑主要包含在 [setupRenderEffect]{.mark} 这个函数中。

我们先看一个有意思的示例

相对于传统的 [jQuery]{.mark} 一把梭子撸到底的开发模式，组件化可以帮助我们实现 [视图]{.mark} 和 [逻辑]{.mark} 的复用，并且可以对每个部分进行单独的思考

自从 2020 年 9 月 18 日 Vue 3 正式发布以来，已经有两年多时间了，终于在 2022 年 2 月 7 日 Vue 作者发布了一则消息：Vue 3 将成为新的默认版本。与此同时，Vue 相关官方周边的核心库 latest 发布标签将指向其 Vue 3 的兼容版本。