useBoolean

作用

优雅的管理 boolean 状态的 Hook

原理

通过 useToggle 实现，返回一个元组，元组的第一个元素是状态，第二个元素是一个对象，对象中有四个方法，分别是 toggle，set，setLeft，setRight > useBoolean 只是 useToggle 的一个特殊使用场景

源码

import { useMemo } from 'react'
import useToggle from '../useToggle'

export interface Actions {
  setTrue: () => void
  setFalse: () => void
  set: (value: boolean) => void
  toggle: () => void
}

export default function useBoolean(defaultValue = false): [boolean, Actions] {
  const [state, { toggle, set }] = useToggle(!!defaultValue)

  const actions: Actions = useMemo(() => {
    const setTrue = () => set(true)
    const setFalse = () => set(false)
    return {
      toggle,
      set: (v) => set(!!v),
      setTrue,
      setFalse
    }
  }, [])

  return [state, actions]
}