0.6.1 • Published 4 years ago

scrollify-list v0.6.1

Weekly downloads
12
License
MIT
Repository
github
Last release
4 years ago

scrollify-list

Super easy client-side infinite scroll for React.

Handy in a situation where you are needed to render a big chunk of data.

Usage

Install:

npm install --save scrollify-list

How to use (basic example):

import React from 'react'
import ReactDOM from 'react-dom'
import ScrollifyList from 'scrollify-list'

const generateData = () =>
  Array(500)
    .fill(null)
    .map(() => ({
      id: Math.random()
        .toString(36)
        .substring(7),
      name: Math.random()
        .toString(36)
        .substring(7),
    }))

const App = () => (
  <ScrollifyList
    data={generateData()}
    render={data => <h1 key={data.id}>{data.name}</h1>}
  />
)

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

Configure

PropertyExplanation
dataYour data! Array of something.
renderHow do you want to render your data?
pageSizeHow many rows in one page? Defaults to 15.

Develop

  1. npm run dev
  2. cd examples/basic/ && npm install && npm run start
  3. Go to http://localhost:1234/
  4. Make changes to /src/index.js
  5. ???
  6. Profit! 😎✌️
0.6.1

4 years ago

0.6.0

4 years ago

0.4.2

6 years ago

0.4.1

6 years ago

0.3.3

6 years ago

0.3.2

7 years ago

0.3.1

7 years ago

0.3.0

7 years ago