vue3实现v-model原理详解

vue3 源码正式放出来了，想必大家也都开始争先恐后的学习 vue3 的知识了。这也说明了 proxy 只能代理一层对象，不能深层代理！又因为我们要储存对象的映射，所以需要使用map函数。下面是reactive完整的代码。定义watcher 用来作为 compile 跟 reactive 的桥梁， 跟 vue3 的实现可能不一样这里只是模拟编译，真正的编译不是这样的获取到模板上的 v-model 、 v-bind 属性，获取到绑定的属性。当数据发生变化时，更新视图，当视图改变数据时修改数据，具体代码如下trigger 对依赖进行触发假设我们有一个模板是这样的，接下来我们在这个模板的 id="my-app" 元素内实现双向绑定vue3 中 new Vue 已经被 createApp 所代替，reactive 是反应原理，可以抽出来单独使用，vue3 外漏了所有内部的 api，都可以在外部使用