Collection of React Native Hooks (fork of react-use)
npm install react-use-nativelibreact.npm i react-use-native
- Animations
- useRaf — re-renders component on each requestAnimationFrame.
- useInterval — re-renders component on a set interval using setInterval.
- useTimeout — re-renders component after a timeout.
- useTimeoutFn — calls given function after a timeout. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/animation-usetimeoutfn--demo)
- useUpdate — returns a callback, which re-renders component when called.
- Side-effects
- useAsync, useAsyncFn, and useAsyncRetry — resolves an async function.
- useDebounce — debounces a function. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/side-effects-usedebounce--demo)
- useError — error dispatcher. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/side-effects-useerror--demo)
- useRafLoop — calls given function inside the RAF loop.
- useThrottle and useThrottleFn — throttles a function. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/side-effects-usethrottle--demo)
- Lifecycles
- useEffectOnce — a modified useEffect hook that only runs once.
- useLifecycles — calls mount and unmount callbacks.
- useMountedState and useUnmountPromise — track if component is mounted.
- usePromise — resolves promise only while component is mounted.
- useLogger — logs in console as component goes through life-cycles.
- useMount — calls mount callbacks.
- useUnmount — calls unmount callbacks.
- useUpdateEffect — run an effect only on updates.
- useIsomorphicLayoutEffect — useLayoutEffect that that works on server.
- useDeepCompareEffect, useShallowCompareEffect, and useCustomCompareEffect
- State
- createMemo — factory of memoized hooks.
- createReducer — factory of reducer hooks with custom middleware.
- createReducerContext and createStateContext — factory of hooks for a sharing state between components.
- useDefault — returns the default value when state is null or undefined.
- useGetSet — returns state getter get() instead of raw state.
- useGetSetState — as if useGetSet and useSetState had a baby.
- useLatest — returns the latest state or props
- usePrevious — returns the previous state or props. [![][img-demo]](https://codesandbox.io/s/fervent-galileo-krgx6)
- usePreviousDistinct — like usePrevious but with a predicate to determine if previous should update.
- useObservable — tracks latest value of an Observable.
- useRafState — creates setState method which only updates after requestAnimationFrame. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-userafstate--demo)
- useSetState — creates setState method which works like this.setState. [![][img-demo]](https://codesandbox.io/s/n75zqn1xp0)
- useStateList — circularly iterates over an array. [![][img-demo]](https://codesandbox.io/s/bold-dewdney-pjzkd)
- useToggle and useBoolean — tracks state of a boolean. [![][img-demo]](https://codesandbox.io/s/focused-sammet-brw2d)
- useCounter and useNumber — tracks state of a number. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-usecounter--demo)
- useList ~and useUpsert~ — tracks state of an array. [![][img-demo]](https://codesandbox.io/s/wonderful-mahavira-1sm0w)
- useMap — tracks state of an object. [![][img-demo]](https://codesandbox.io/s/quirky-dewdney-gi161)
- useSet — tracks state of a Set. [![][img-demo]](https://codesandbox.io/s/bold-shtern-6jlgw)
- useQueue — implements simple queue.
- useStateValidator — tracks state of an object. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-usestatevalidator--demo)
- useStateWithHistory — stores previous state values and provides handles to travel through them. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-usestatewithhistory--demo)
- useMultiStateValidator — alike the useStateValidator, but tracks multiple states at a time. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-usemultistatevalidator--demo)
- useMediatedState — like the regular useState but with mediation by custom function. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-usemediatedstate--demo)
- useFirstMountState — check if current render is first. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-usefirstmountstate--demo)
- useRendersCount — count component renders. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-userenderscount--demo)
- createGlobalState — cross component shared state.[![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-createglobalstate--demo)
- useMethods — neat alternative to useReducer. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-usemethods--demo)
- [Miscellaneous]()
- useEnsuredForwardedRef and ensuredForwardRef — use a React.forwardedRef safely. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-useensuredforwardedref--demo)
Usage — how to import.
Unlicense — public domain.
Support — add yourself to backer list below.
[img-demo]: https://img.shields.io/badge/demo-%20%20%20%F0%9F%9A%80-green.svg