❤
npm
Sign UpSign In

react-listable

1.0.6 • Public • Published

react-listable

A collection of react components that iterates over the each prop and renders the render prop. Demo

Overview

 
const users = [{ name: 'Victor 😎', age: 10 }]
<For each={users} render={
  ({ name, age }) => <p>{ name }, { age }</p>
}/>
 

Installation

You can use npm/yarn to install

npm install react-listable

Documentation

For

<For 
  each={state.users} 
  loader={() => <div>loading</div>}
  render={
    ({ name, age }) => <p>{ name }, { age }</p>
  }/>

Ul

<Ul 
  className="list"
  each={state.users} 
  setActive={({ name }) => name === 'Maria 🙍'}
  render={
    ({ name, age }) => <p>{ name }, { age }</p>
  }/>

Ol

<Ol 
  className="list"
  each={state.users} 
  render={
    ({ name, age }) => <p>{ name }, { age }</p>
  }/>
 

See the full documentation and live examples at https://victorvoid.me/react-listable

License

The code is available under the MIT License.

Readme

Keywords

Package Sidebar

Install

npm i react-listable

Repository

github.com/victorvoid/react-listable

Homepage

github.com/victorvoid/react-listable#readme

Weekly Downloads

801

Version

1.0.6

License

MIT

Unpacked Size

22.9 kB

Total Files

22

Last publish

Collaborators

  • victorvoid
Try on RunKit
Report malware