1.0.7 • Published 5 years ago

number-rock-react

Licence

ISC

Version

1.0.7

Deps

Size

7 kB

Vulns

Weekly

Summary Dependency Versions

About number-rock-react

A component that lets numbers animated, for react

Install

npm install number-rock-react --save

Usage

import NumberRock from 'number-rock-react';
<NumberRock 
  start={888} 
  end={1234} 
  precision={2} 
  duration={2000}
  >
</NumberRock>

Props

property 参数	description 描述	require 是否必须	type 类型	fn accept property 函数接收的参数
start	start number 开始值	TRUE	number
end	end number 结束值	TRUE	number
precision	precision number精度	FALSE	number
duration	duration time 持续时间	FALSE	number
formate	function, must return a val 格式化方法，接收一个参数，必须返回一个处理后的值	FALSE	function	number
onProgress	callback in progress 翻滚进行中触发的方法	FALSE	function	frameVal, progress
onEnd	callback at the end 翻滚结束后的回调	FALSE	function	end
className	name of the component class 类名	FALSE	string
processingClassName	name of the processing class 翻滚进行中的类名	FALSE	string
style	style 样式	FALSE	object
processingStyle	style in progress 翻滚进行中的样式	FALSE	object

Example

import React,{ Component } from 'react';
import ReactDOM from 'react-dom';
import NumberRock from 'number-rock-react';

const formate = v => '
 + v;

class App extends Component {
  render() {
    return (
      <NumberRock 
        start={888} 
        end={1234} 
        precision={2} 
        duration={2000}
        formate={formate}
        >
      </NumberRock>
    );
  }
}

ReactDOM.render(<App/>,document.getElementById('root'))