11- React Hooks 原理

82 阅读1分钟

Hooks实现原理

  • React的useState:通过链表来实现

关键点:保证组件每次渲染时,都以相同的顺序调用Hooks

type Hook = {
  memonizedState:any,
  baseState:any,
  next: Hook | null
}

// 伪代码

let hook:Hook
hook
hook.next
hook.next.next

Hooks的使用规则:

1. 只能在函数组件或者自定义Hooks中使用
1. 只能在最顶级使用,不能在if/for/嵌套函数使用(如果这样做不能确保调用顺序一致)