use-spring
[![](https://badgen.net/bundlephobia/minzip/use-spring)](https://bundlephobia.com/result?p=use-spring) ![](https://badgen.net/david/dep/pomber/use-spring) ![](https://badgen.net/npm/types/use-spring)
Last updated 7 months ago by pomber .
MIT · Repository · Original npm · Tarball · package.json
$ cnpm install use-spring 
SYNC missed versions from official npm registry.

use-spring

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

Current Tags

  • 0.2.3                                ...           latest (7 months ago)

7 Versions

  • 0.2.3                                ...           7 months ago
  • 0.2.2                                ...           8 months ago
  • 0.2.1                                ...           9 months ago
  • 0.2.0                                ...           9 months ago
  • 0.1.1                                ...           a year ago
  • 0.1.0                                ...           a year ago
  • 0.0.1                                ...           a year ago
Maintainers (1)
Downloads
Today 0
This Week 1
This Month 1
Last Day 0
Last Week 1
Last Month 5
Dependencies (0)
None
Dev Dependencies (16)

Copyright 2014 - 2016 © taobao.org |