npm i @react-hook/toggle
A React hook for toggling between two values
import useToggle from '@react-hook/toggle'
const Component = (props) => {
const [value, toggle] = useToggle(false, true)
return (
<button onClick={toggle}>
{value === false ? 'Toggle on' : 'Toggle off'}
</button>
)
}
function useToggle<Off extends any, On extends any>(
off: Off,
on: On,
defaultValue: Off | On = off
): [Off | On, () => void]
Argument | Type | Default | Required? | Description |
---|---|---|---|---|
off | Off |
false |
No | The value of the toggle in its off state |
on | On |
true |
No | The value of the toggle in its on state |
defaultValue | Off | On |
off |
No | The default value of the toggle, either the value of off or on |
MIT