1.0.0 • Published 6 years ago

react-slot-machine v1.0.0

Weekly downloads
124
License
MIT
Repository
github
Last release
6 years ago

react-slot-machine

A slot machine library for React

DEMO

DEMO

Installation

npm i --save react-slot-machine
# or
yarn add react-slot-machine

Usage

import React from 'react';
import Slot from 'react-slot-machine';

import list from './my-list';

const YourComponent = props => (
  <div>
    <Slot /* props */>
      {
        list.map(value =>
          <div style={width: '100%', height: '100%'}>
            {value}
          </div>
        )
          // Children of `Slot` be sure to be `width` and `height` are 100%.
      }
    </Slot>
  </div>
)

props

NameTypeRequiredDescription
targetNumberxIndex to target item
durationNumber Duration of scrolling
easingFunction Easing function (see below)
timesNumber Times to spin
onEndFunction Event fires on ended of scrolling
classNameString className

Easing Function

Function receive (elapsed, initialValue, amountOfChange, duration) and return value to change.

It is compatible with bameyrick/js-easing-functions.

LICENSE

Written by MIT LICENSE

1.0.0

6 years ago

0.0.2

6 years ago

0.0.1

6 years ago