- Sensors
useBattery
โ tracks device battery state.useGeolocation
โ tracks geo location state of user's device.useHover
โ tracks mouse hover state of some element.useIdle
โ tracks whether user is being inactive.useLocation
โ tracks page navigation bar location state.useMedia
โ tracks state of a CSS media query.useMediaDevices
โ tracks state of connected hardware devices.useMotion
โ tracks state of device's motion sensor.useNetwork
โ tracks state of user's internet connection.useOrientation
โ tracks state of device's screen orientation.useSize
โ tracks some HTML element's dimensions.useWindowSize
โ tracksWindow
dimensions.
- UI
useAudio
โ plays audio and exposes its controls.useOutsideClick
โ triggers callback when user clicks outside target area.useSpeech
โ synthesizes speech from a text string.useVideo
โ plays video, tracks its state, and exposes playback controls.
- Animations
useRaf
โ re-renders component on eachreaquestAnimationFrame
.useSpring
โ interpolates number over time according to spring dynamics.useTimeout
โ returns true after a timeout.useTween
โ re-renders component, while tweening a number from 0 to 1.useUpdate
โ returns a callback, which re-renders component when called.
- Side-effects
useAsync
โ resolves anasync
function.useCss
โ dynamically adjusts CSS.useFavicon
โ sets favicon of the page.useTitle
โ sets title of the page.
- Lifecycles
useLifecycles
โ callsmount
andunmount
callbacks.useLogger
โ logs in console as component goes though life-cycles.useMount
โ callsmount
callbacks.useUnmount
โ callsunmount
callbacks.
- State
createMemo
โ factory of memoized hooks.useCallbag
โ tracks latest value of a callbag.useGetSet
โ returns state getterget()
instead of raw state.useGetSetState
โ as ifuseGetSet
anduseSetState
had a baby.useObservable
โ tracks latest value of anObservable
.useSetState
โ createssetState
method which works likethis.setState
.useToggle
anduseBoolean
โ tracks state of a boolean.useCounter
anduseNumber
โ tracks state of a number.useList
โ tracks state of an array.useMap
โ tracks state of an object.
- You need to have React
16.7.0-alpha.0
or later installed to use Hooks API. - You can import each hook individually
import useToggle from 'react-use/lib/useToggle'
.
Unlicense โ public domain.