Nutty Peanut Marshmallow

    rn-inifinitscroll-load

    1.0.2 • Public • Published

    rn-inifinitScroll-load

    Node.js



    BUILD SETUP

     
    ## Installation 
    Version 1.0.2
     
    npm install rn-inifinitScroll-load --save
     
     
     

    USAGE

     
    import InfiniteScroll from rn-inifinitScroll-load
     
    class App extends Component {
        state={
            active:0,
              itemRender: 9,
        increase: 5,
         data: [
          {
            userId: 1,
            id: 1,
            title: 'delectus aut autem',
            completed: false,
          },
          {
            userId: 1,
            id: 2,
            title: 'quis ut nam facilis et officia qui',
            completed: false,
          },
          {
            userId: 1,
            id: 3,
            title: 'fugiat veniam minus',
            completed: false,
          },
          {
            userId: 1,
            id: 4,
            title: 'et porro tempora',
            completed: true,
          },
          {
            userId: 1,
            id: 5,
            title:
              'laboriosam mollitia et enim quasi adipisci quia provident illum',
            completed: false,
          },
          {
            userId: 1,
            id: 6,
            title: 'qui ullam ratione quibusdam voluptatem quia omnis',
            completed: false,
          },
          {
            userId: 1,
            id: 7,
            title: 'illo expedita consequatur quia in',
            completed: false,
          },
          {
            userId: 1,
            id: 8,
            title: 'quo adipisci enim quam ut ab',
            completed: true,
          },
          {
            userId: 1,
            id: 9,
            title: 'molestiae perspiciatis ipsa',
            completed: false,
          },
          {
            userId: 1,
            id: 10,
            title: 'illo est ratione doloremque quia maiores aut',
            completed: true,
          },
          {
            userId: 1,
            id: 11,
            title: 'vero rerum temporibus dolor',
            completed: true,
          },
          {
            userId: 1,
            id: 12,
            title: 'ipsa repellendus fugit nisi',
            completed: true,
          },
          {
            userId: 1,
            id: 13,
            title: 'et doloremque nulla',
            completed: false,
          },
          {
            userId: 1,
            id: 14,
            title: 'repellendus sunt dolores architecto voluptatum',
            completed: true,
          },
          {
            userId: 1,
            id: 15,
            title: 'ab voluptatum amet voluptas',
            completed: true,
          },
          {
            userId: 1,
            id: 16,
            title: 'accusamus eos facilis sint et aut voluptatem',
            completed: true,
          },
          {
            userId: 1,
            id: 17,
            title: 'quo laboriosam deleniti aut qui',
            completed: true,
          },
          {
            userId: 1,
            id: 18,
            title: 'dolorum est consequatur ea mollitia in culpa',
            completed: false,
          },
          {
            userId: 1,
            id: 19,
            title: 'molestiae ipsa aut voluptatibus pariatur dolor nihil',
            completed: true,
          },
        }
    booleanFunc = () => {
        this.setState({
          itemRender: this.state.itemRender + this.state.increase,
     
        });
      };
      renderItem = ({item, index}) => {
        if (index + 1 <= this.state.itemRender) {
          // console.log(item.views)
     
          return (
            <View>
              <Text>{item.userId}</Text>
              <Text>{item.title}</Text>
              <Text>{item.completed}</Text>
            </View>
          );
        }
      };
        render(){
           <View>
              <InfiniteScroll
                renderItem={this.renderItem}
                booleanFunc={this.booleanFunc}
                data={this.state.data}
                limit={this.state.itemRender}
                newIncrease={this.state.increase}
              />
     
            </View>
     
     
            )
        }
    }
    Girl in a jacket

    Current API(Property)

    Property Type Description
    renderItem component render component
    booleanFunc PropTypes.function update state item
    data PropTypes.Array of Objct item that will be rendering
    limit PropTypes.number amount of item will display first
    newIncrease PropTypes.number amount of item that increase

    Project Documentation

    • Author Account
    Arwy Syahputra Siregar
    github.com/arwysyah
     

    Copyright ©

    by Arwy Syahputra Siregar

    Install

    npm i rn-inifinitscroll-load

    DownloadsWeekly Downloads

    4

    Version

    1.0.2

    License

    ISC

    Unpacked Size

    516 kB

    Total Files

    4

    Last publish

    Collaborators

    • arwysyah