dj
5a24b61edf
- 添加 effect 函数用于创建响应性副作用 - 实现 ReactiveEffect 类来管理响应性执行 - 添加 track 函数用于依赖收集 - 添加 trigger 函数用于触发依赖更新 - 在 baseHandlers 中实现 Proxy 的 get 和 set 拦截器 - 将 effect 导出到 vue 包的入口文件 - 添加 dev 脚本用于监听构建 - 更新示例文件展示响应性功能的使用 - 修复 README.md 中代码块格式问题
34 lines
635 B
TypeScript
34 lines
635 B
TypeScript
export function effect<T = any>(fn: () => T) {
|
|
const _effect = new ReactiveEffect(fn)
|
|
_effect.run()
|
|
}
|
|
|
|
export let activeEffect: ReactiveEffect | undefined
|
|
|
|
export class ReactiveEffect<T = any> {
|
|
constructor(public fn: () => T) {}
|
|
run() {
|
|
activeEffect = this
|
|
return this.fn()
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 收集依赖
|
|
* @param target
|
|
* @param key
|
|
*/
|
|
export function track(target: object, key: unknown) {
|
|
console.log('收集依赖 track')
|
|
}
|
|
|
|
/**
|
|
* 触发依赖
|
|
* @param target
|
|
* @param key
|
|
* @param newValue
|
|
*/
|
|
export function trigger(target: object, key: unknown, newValue: unknown) {
|
|
console.log('触发依赖 trigger')
|
|
}
|