input-search-reactjs/src/index.js

A simple search/filter component

import React from 'react'

function SearchInput(props) {

    const data = props.data;
    const matchedValue = props.matchedValue;

    const isEqual = (a, b) => {
        if (b.length === 0) return false;
        var min = Math.min(a.length, b.length);
        return a.substring(0, min) === b;
    }
    const fetchMatch = (e) => {
        var arr = [];
        data.map((dat) => {
            if (isEqual(dat, e)) {
                arr.push(dat);
            }
            return arr;
        })
        matchedValue(arr);
    }
    return (
        <div>
            <input onChange={(e) => fetchMatch(e.target.value)}></input>
        </div>
    )
}

export default SearchInput