0.1.4 • Published 4 years ago

react-complete v0.1.4

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

React-Complete

simple customizable react autocomplete component

Demo

Codesandbox

Install

npm install react-complete --save

Usage

import Complete from 'react-complete';
<Complete data={data} prop={prop} field={field} />

Data

const data = ['react', 'vue', 'angular'];

const data = (value) => fetch('...').then((res) => res.json());
const data = {
  languages: {
    name: 'javascript',
    frameworks: [
      {
        name: 'react',
      },
      {
        name: 'vue',
      },
      {
        name: 'angular',
      },
    ],
  },
};
<Complete data={data} prop="languages.frameworks" field="name" />

Custom Input Component

<Complete
  inputComp={
    <input type="text" placeholder="search..." className="search-input" />
  }
/>

Custom Item Component

Parameter is object that contain 'fetch' result(item) and searching array's field(raw)

<Complete
  renderItem={({ item, raw }) => (
    <div className="item">
      <img src={item.img} />
      <span>{raw}</span>
    </div>
  )}
/>

License

ISC

0.1.4

4 years ago

0.1.3

4 years ago

0.1.2

4 years ago

0.1.1

4 years ago

0.1.0

4 years ago

0.0.4

4 years ago

0.0.3

4 years ago

0.0.2

4 years ago

0.0.1

4 years ago