useToggle()
<img alt="Bundlephobia" src="https://img.shields.io/bundlephobia/minzip/@react-hook/toggle?style=for-the-badge&labelColor=24292e"><img alt="Types" src="https://img.shields.io/npm/types/@react-hook/toggle?style=for-the-badge&labelColor=24292e"><img alt="NPM Version" src="https://img.shields.io/npm/v/@react-hook/toggle?style=for-the-badge&labelColor=24292e"><img alt="MIT License" src="https://img.shields.io/npm/l/@react-hook/toggle?style=for-the-badge&labelColor=24292e">
npm i @react-hook/toggle
A React hook for toggling between two values
Quick Start
```jsx harmony 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>## API
### useToggle(off?, on?, defaultValue?)
```ts
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 |