react-iscroll-mobile

mobile iscroll react modules

install

Usage

require('../assets/index.less');
const React = require('react');
const ReactDOM = require('react-dom');
const Iscroll = require('react-iscroll-mobile');


const Test = React.createClass({

  _scroll(obj){
    var y = obj.y,
      maxY = obj.maxScrollY - y;

    if(y >= 40){
      return "";
    }else if(y < 40 && y > 0){
      return "";
    }

    if(maxY >= 40){
      return "";
    }else if(maxY < 40 && maxY >=0){
      return "";
    }
  },

  _slideDown(obj){
    if(obj.y > 40){
      alert("slideDown");
    }
  },

  _slideUp(obj){
    if(obj.maxScrollY - obj.y > 40){
      alert("slideUp");
    }
  },
  render() {
    return (
      <Iscroll mouseWheel={false}
              probeType={3}
              wrapperClass="wrapper"
              scroll={this._scroll}
              slideDown={this._slideDown}
              slideUp={this._slideUp}
        >
        <ul>
          <li>Pretty row 1</li>
          <li>Pretty row 2</li>
          <li>Pretty row 3</li>
          <li>Pretty row 4</li>
          <li>Pretty row 5</li>
          <li>Pretty row 6</li>
          <li>Pretty row 7</li>
          <li>Pretty row 8</li>
          <li>Pretty row 9</li>
          <li>Pretty row 10</li>
          <li>Pretty row 11</li>
          <li>Pretty row 12</li>
          <li>Pretty row 13</li>
          <li>Pretty row 14</li>
          <li>Pretty row 15</li>
          <li>Pretty row 16</li>
          <li>Pretty row 17</li>
          <li>Pretty row 18</li>
          <li>Pretty row 19</li>
          <li>Pretty row 20</li>
        </ul>
      </Iscroll>
    );
  },
});

ReactDOM.render(<Test />, document.getElementById('__react-content'));

API

props

Development

npm install react-iscroll-mobile --save
npm start

Example

https://github.com/wenshan/react-iscroll-mobile