Vue | Youdeyiwu

Tags

Project Structure

Vue

Admins

Vue 是一个用于构建用户界面的渐进式 JavaScript 框架

渐进式：含义是指逐步引入和灵活集成，而不是要求一次性重写整个应用程序

Vue Official Website：https://vuejs.org

Vue Api：https://vuejs.org/api

Vue Playground：https://play.vuejs.org

Vue isReactive 工具函数原理

检查一个对象是否是由 reactive() 或 shallowReactive() 创建的代理

Vue computed 计算属性原理

computed 函数通过内部的 ReactiveEffect 实现了对依赖项的追踪和更新，从而实现了计算属性的响应式特性

Vue unref 工具函数原理

如果参数是 ref，则返回 ref.value，否则返回参数本身

Vue 中的 effect 函数

Vue 的 effect 函数会在依赖的响应式数据发生变化时自动重新执行，从而实现数据驱动的视图更新

Vue isReadonly 工具函数原理

检查传入的值是否为只读对象，通过 readonly() 和 shallowReadonly() 创建的代理都是只读的

Vue toRefs 工具函数原理

将响应式对象的所有属性都转换为 ref，并返回一个包含这些 ref 的对象

Vue watch 和 watchEffect 侦听器原理

通过 getter 提取数据，ReactiveEffect 追踪依赖，scheduler 调度回调函数执行

Vue toRef 工具函数原理

toRef 可以灵活地将各种输入转换为 ref，并且根据输入类型提供不同的行为

Vue isProxy 工具函数原理

检查一个对象是否是由 reactive()、readonly()、shallowReactive() 或 shallowReadonly() 创建的代理

Vue isRef 工具函数原理

检查某个值是否为 ref

Vue 项目结构和包的调试

Vue 的项目存储库采用的是 monorepo 设置，即将多个项目的源代码存储在同一个代码库，并使用 pnpm 来管理 monorepo

Vue toValue 工具函数原理

将不同类型的输入（包括普通值、ref、getter）标准化为值

Vue Ref 实现原理

Vue Ref 也是通过 getter 和 setter 方法来拦截对象属性的 get 和 set 操作，实现依赖追踪和更新

Vue Reactive 中的响应式 effect 类

在 Vue Reactive 的依赖追踪中，使用 ReactiveEffect 类来表示依赖关系

Vue Reactive 依赖追踪和触发更新

在 Vue Reactive ProxyHandler 实现中，get 方法进行依赖追踪，set 方法进行触发更新

Related Actions

Related Articles

Vue Reactive 依赖追踪和触发更新

Vue 中的 effect 函数

Vue computed 计算属性原理

Vue Reactive 中的响应式 effect 类

Vue isReactive 工具函数原理