chook

reack hook library

npm i @kartjim/chook

or

yarn add @kartjim/chook

📃 Documentation

• ✍️ state
  • useSetState 管理 object 类型 state 的 Hooks
  • useBoolean 更好管理 Boolean 的 Hook
  • usePrevious 保存上一次渲染时 state 的值。
  • useSafeState 用法与 React.useState 完全一样，避免因组件卸载后更新状态而导致的内存泄漏。
  • useDebounce 用于防抖的 Hook 函数
  • useThrottle 用于节流的 Hook 函数
  • useSet 用于操作 Set 数据类型的 Hook
  • useMap 用于操作 Map 数据类型的 Hook
  • useClippy 用于读取和写入用户的剪贴板的 Hook
  • useFirstMountState 判断组件是否是首次渲染的 Hook
  • useLatest 对 useRef 进行封装，保证每次拿到最新的值，避免你闭包问题。
• 🔔 effect
  • useUpdate 实现组件的强制更新。
  • useTimeout 在函数组件里可使用 setTimeout 一样使用 useTimeout 。
  • useInterval 在函数组件里可使用 setInterval 一样使用 useInterval 。
  • useUpdateEffect 更新后立即调用，但是首次渲染不会执行此方法。
• 🔯 lifecycle
  • useMount 实现类似于 class 组件中的 componentDidMount 生命周期钩子
  • useUnmount 实现类似于 class 组件中的 componentWillUnmount 生命周期钩子。
  • useUnmountedRef 获取当前组件是否已经卸载的 Hook。
• 🪢 dom
  • useTitle 自定义页面title
  • useFavicon 设置页面 favicon 的 Hook
  • useActive 监控点击事件
  • useClickOutside 监听目标元素外的点击事件
  • useFocus 监控是否拥有焦点
  • useHover 监控鼠标是否移入
  • useMousePosition 获取鼠标的 offsetX 和 offsetY 值
• 🦴 optimize
  • useClosure 替代 useCallback ，避免闭包陷阱。

LICENSE

MIT