mirror of
https://github.com/streamich/react-use.git
synced 2025-12-08 18:02:14 +00:00
61700675cd
This change removes useCallbag hook, it also reverts back changes for
hooks that only have tiny dependencies or dependencies that could have
been part of the hook itself. Effectivly only KeyboardJS and Rebound are
large packages that only partially are used by react-use, hence require
user to install them separately.
BREAKING CHANGE: 🧨 useCallbag hook is removed, some hooks KeyboardJS and Rebound installed
separately
42 lines
667 B
Markdown
42 lines
667 B
Markdown
# `useSpring`
|
|
|
|
React animation hook that updates a single numeric value over time according
|
|
to spring dynamics.
|
|
|
|
Requires `rebound`:
|
|
|
|
```bash
|
|
npm add rebound
|
|
# or
|
|
yarn add rebound
|
|
```
|
|
|
|
## Usage
|
|
|
|
```jsx
|
|
import {useSpring} from 'react-use';
|
|
|
|
const Demo = () => {
|
|
const [target, setTarget] = useState(50);
|
|
const value = useSpring(target);
|
|
|
|
return (
|
|
<div>
|
|
{value}
|
|
<br />
|
|
<button onClick={() => setTarget(0)}>Set 0</button>
|
|
<button onClick={() => setTarget(100)}>Set 100</button>
|
|
</div>
|
|
);
|
|
};
|
|
```
|
|
|
|
|
|
# Reference
|
|
|
|
|
|
```js
|
|
const currentValue = useSpring(targetValue);
|
|
const currentValue = useSpring(targetValue, tension, friction);
|
|
```
|