Skip to content

woow-wu7/7-a-hooks2.0-source-code-analysis

Repository files navigation

7-a-hooks-source-code-analysis

任务清单 - 完成度

  • useUpdate -> 强制组件重新渲染
  • useUpdateEffect -> 用法上和useEffect完全保持一致,只是 ( useUpdateEffect ) 忽略了 ( 首次渲染 ),并且 ( 只在依赖项更新时运行 )
  • useLocalStorageState
  • useToggle useBoolean
  • useTimeout
  • useFullscreen
  • useResponsive configResponsive
  • useMap
  • useSetState -> 类似于class中的this.setState()
  • useTitle
  • useLockFn -> 用于给一个 ( 异步函数 ) 添加 ( 竞态锁 ),防止 ( 并发执行 )
  • useCreation -> 是 useMemo 或 useRef 的替代品
  • useTextSelection -> 实时获取用户当前选取的文本内容及位置
  • useEventListener -> 优雅的使用 addEventListener
  • useMouse - 依赖 useEventListener -> 一个跟踪鼠标信息的hook
  • useFavicon -> 设置和切换页面的favicon
  • useInterval -> 一个用来处理 setInterval 的hook,具有设置 immediate,delay 的加强功能
  • usePersistFn -> 持久化function的hooks,注意和useCallback的区别
  • useMount -> 只在mount阶段执行的hook,注意只在mount阶段执行一次
  • useUnmount -> 只在组件 unmount 时执行的hook,利用 useEffect的参数函数的返回函数实现
  • useUnmountRef -> 获取当前组件 ( 是否被卸载 ) 的hook
  • useClickAway -> 管理目标元素外的点击事件
  • useScroll -> 获取元素的 滚动 状态的hook
  • useKeyPress -> 一个优雅的管理 keyup 和 keydown 键盘事件的 Hook,支持 ( keyFilter支持键盘组合键,key,keycode,别名,返回值是boolean的回调 )
  • useInViewport -> 一个用于判断dom元素是否在可视化范围之内的hook
  • useEventTarget -> 对表单控件中的 onChange 和 value 的封装,具有 reset transform 等功能
  • useHover -> 利用 useEventListener 和 useBoolean(useToggle) 实现,表示鼠标是否悬停在DOM元素上
  • useSize

(二) 其他源码分析

(1) redux 和 react-redux 源码分析 [redux^4.0.5]

(2) 手写 webpack Compiler 源码 [webpack^4.42.0]

(3) axios 源码分析 [axios^0.20.0]

(4) vue 源码分析 [vue^2.6.12]

(5) vuex 源码分析 [v2.6.10]

(6) react 源码分析 [react^17.0.3]

(7) a-hooks2.0 源码分析 [a-hooks^2.10.9]

(8) a-hooks3.0 源码分析 [a-hooks^2.10.9]

(9) koa 源码分析 [koa^2.13.1]

(10) badJs-report 源码分析

(11) element-ui 源码分析

About

a-hooks2.0源码分析

Resources

License

Security policy

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published