5C24

普通插槽 happy path 实现目标：把App.js中h("p", {}, "123")添加到foo组件内 代码实现 通过this获取到$slots 接下来只需要构建instance.slots即

props 需求 从setup中传入 在render中可以通过this来访问props的值 props第一层不可以被修改，内部深层次不做处理 场景 实现代码 在setupComponent初始化pro

首先对之前的happy path进行一下改造 接下来我们要实现的就是，鼠标在div上摁下执行mousedown，放开执行click 还记得我们之前在renderer.ts中的mountElement方

shapeFlag用于描述当前虚拟节点vnode的类型，在目前的实现代码中有两处需要用到shapeFlag进行判断 renderer.ts的patch方法中判断vnode是Element``Compn

实现目标：render函数中通过this获取setup返回的属性，获取$el setupState 获取 在之前实现Component初始化主流程的过程中，我们将setup的返回值赋值给了组件实例in

happy path 以上是一个简单的 happy path 最终要实现的目标是在浏览器渲染出上图内容 runtime-core 初始化 分析： createApp接收一个根组件，return一个对象

happy path 单元测试 以上是一个简单的 computed get 操作 代码实现 should compute lazily 单元测试 断言1 从断言1可以知道, computed 是懒执行

isRef 判断是不是 ref 单元测试 代码实现 这里返回值加上两个感叹号是为了如果参数不是一个 ref,那么 ref.__v_isRef 是 undefined。所以要变成boolean 值 un

reactive 通过 proxy 进行 get set 操作实现响应式。但是 reactive 只作用于对象。那么像 1，true，'1'这类的单值怎么实现响应式呢？ ref 想实现这些单值的响应式