tuns-mobile-components/src/pages/demo/listscroll/index.js

Tuns Design UI

import React, { Component } from "react";
import { delay } from "tuns-utils";
import ListScroll from "../../../components/mobile/src/listscroll";

class ListScrollDemo extends Component {
  state = {
    data: [...Array(10)],
  };

  loadFunc = async () => {
    const { data } = this.state;
    await delay(1500);
    await this.setState({
      data: [...data, ...Array(10)],
    });
  };

  render() {
    const { data } = this.state;
    return (
      <div style={{ height: "2000px", overflow: "auto" }}>
        <ListScroll onLoad={this.loadFunc}>
          {data.map((item, index) => (
            <div
              key={index}
              style={{
                height: "300px",
                backgroundColor: `#${(((1 << 24) * Math.random()) | 0).toString(
                  16
                )}`,
              }}
            >
              {`more content ${index}`}
            </div>
          ))}
        </ListScroll>
      </div>
    );
  }
}

export default ListScrollDemo;