useBoolean

Administra un valor booleano con funciones de utilidad útiles.

Instalación

Instale el custom hook desde su terminal.

npm i @raddix/use-boolean

Uso

En este ejemplo, vamos a abrir un menu cuando el cursor pase sobre el botón y se cerrará cuando el cursor salga del contenedor del menú. Si hace click sobre el botón se abrira/cerrará.

import { useBoolean } from '@raddix/use-boolean';
import { Menu } from './menu'

export default function App() {
  const [open, setOpen] = useBoolean();

  return (
    <div onMouseLeave={setOpen.off}>
     <button onMouseEnter={setOpen.on} onClick={setOpen.toggle}>
       Menu
     </button>

      <Menu />
    </div>
  )
}

API

Parámetros

Nombre	Descripción	Requerido	Valor por defecto
initialValue	El valor inicial del estado booleano.	No	false

Resultado

El hook useBoolean devuelve un array con los siguientes elementos:

Índice	Descripción
[0]	El valor actual del estado.
[1].on	Una función para establecer el valor booleano en true.
[1].off	Una función para establecer el valor booleano en false.
[1].toggle	Una función para negar el estado booleano.