README
React Odometer.js
Simple React wrapper around Odometer.js.
How to use it
- Installation
npm install --save react-odometerjs
or
yarn add react-odometerjs
- Include component in your application:
import Odometer from 'react-odometerjs';
// ...
return <Odometer value={1234} format="(.ddd),dd" />;
Don't forget to include styles on your page. Official themes can be found here.
Options
You can pass odometer options via props. See official documentation of Odometer.js to learn about available options.
Next.js integration
Because Odometer.js requires document
object, we should load library using
dynamic import, to avoid loading library on
server-side.
Example snippet:
import dynamic from 'next/dynamic'
const Odometer = dynamic(import('react-odometerjs'), {
ssr: false,
loading: () => 0
});
// ...
return <Odometer value={1234} format="(.ddd),dd" />;
Gatsby
Odometer.js
import Odometer from 'react-odometerjs'
export default Odometer
App.js
import loadable from '@loadable/component'
const Odometer = loadable(() => import('./Odometer'))
...
<Odometer value={1234} />
Issues
Found an issue? You are welcome here.