Install
npm install use-spring
Use
import React, { useState } from "react"; import ReactDOM from "react-dom"; import { useSpring } from "use-spring"; function App() { const [target, setTarget] = useState(0); const handleTargetChange = e => setTarget(+e.target.value); const [current] = useSpring(target); return ( <div> <input type="range" value={target} onChange={handleTargetChange} /> <br /> <input type="range" value={current} readOnly /> </div> ); } const rootElement = document.getElementById("root"); ReactDOM.render(<App />, rootElement);
Demos
API
// default values: const [x, isMoving] = useSpring(target, { stiffness: 170, damping: 26, mass: 1, decimals: 2, teleport: false, from: target, initialSpeed: 0 });
You can try different values of stiffness, damping or mass on the Spring Editor.
Related
MIT License
Copyright (c) 2019 Rodrigo Pombo
Comments
Nothing yet. Say the first thing.
Sign in to join the conversation.