mirror of
https://github.com/streamich/react-use.git
synced 2026-01-18 14:06:52 +00:00
36 lines
831 B
Markdown
36 lines
831 B
Markdown
# `useTween`
|
|
|
|
React animation hook that tweens a number between 0 and 1.
|
|
|
|
[](https://codesandbox.io/s/52990wwzyl)
|
|
|
|
|
|
## Usage
|
|
|
|
```jsx
|
|
import {useTween} from 'react-use';
|
|
|
|
const Demo = () => {
|
|
const t = useTween();
|
|
|
|
return (
|
|
<div>
|
|
Tween: {t}
|
|
</div>
|
|
);
|
|
};
|
|
```
|
|
|
|
|
|
## Reference
|
|
|
|
```ts
|
|
useTween(easing?: string, ms?: number, delay?: number): number
|
|
```
|
|
|
|
Returns a number that begins with 0 and ends with 1 when animation ends.
|
|
|
|
- `easing` — one of the valid [easing names](https://github.com/streamich/ts-easing/blob/master/src/index.ts), defaults to `inCirc`.
|
|
- `ms` — milliseconds for how long to keep re-rendering component, defaults to `200`.
|
|
- `delay` — delay in milliseconds after which to start re-rendering component, defaults to `0`.
|