search input for react

install

npm install --save-dev search-input-react close-canvas-react style-loader css-loader

webpack.config.js

// add loader
{
    test: /\.css$/,
    loader: "style-loader!css-loader"
}

import

import SearchInput from 'search-input-react'

use

<SeacrchInput
    placeholder='placeholder'
    defaultValue='defaultValue'
    regex={this.searchInputRegex.bind(this)}
    searchClick={this.searchInputClick.bind(this)}
    inputChange={this.searchInputChange.bind(this)}
    setClearValue={handle => this.searchInputClearValue = handle}/>

searchClick: click glass or hit enter，get the value

searchInputClick(value) {
    console.log(value)
}

inputChange: link to searchInput's onChange

searchInputChange(value) {
    console.log(value)
}

placeholder: placeholder, optional

defaultValue: defaultValue, optional

regex: the regex with your logic, optional

setClearValue: clear value, optional