Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

input-search-reactjs

web-thiru22ISC1.0.1

A simple search/filter component

javascript, react, reactjs, search, search-component, input-component, input, react-input-search, react input, react search

readme

This package is a distribution of search-input, compiled for searching items.

🛠 Installation

You can install input-search-reactjs by using npm install input-search-reactjs or npm i input-search-reactjs which will provide access to searching the data easier.

1.Import the package

import SearchInput from 'input-search-reactjs';

2.Create state to store your matched values

const [matchedData,setMatchedData] = useState([]);

3.Props

  • data: exisiting data (array).
  • matchedValue: function to store your matched values(function).

Example

function App(){
    const data = ['example','data']; //existing data
    const [matchedData,setMatchedData] = useState([]);
    return(
        <div>
            <SearchInput data={data} matchedValue={(e)=>setMatchedData(e)}/>
            {
                matchedData.map((value)=>(
                    <p>{value}</p> //matched data compared with existing data
                ))
            }
        </div>
    )
}

🤝 Show your support

Give a ⭐ if this package helped you!