tingle-search-bar

The SearchBar Component for tinglejs

TL;DR

SearchBar 是搜索查询用的输入框。

Install

npm install tingle-search-bar --save

Simple Usage

constructor(props) {
    super(props);
    this.state = {
        value: '',
        keyCode: ''
    };
}
handleChange(value) {
    var t = this;
    t.setState({
        value: value
    });
}
handleKeyDown(keyCode, value) {
    var t = this;
    t.setState({
        keyCode: keyCode,
        value: value
    });
}
render() {
    var t = this;
    return (
        <div>
            <SearchBar placeholder="搜索" value={t.state.value} autoFocus={false} onChange={t.handleChange.bind(t)} onKeyDown={t.handleKeyDown.bind(t)}/>
            {t.state.value}
        </div>
    );
}

Options 可用配置

配置项	必填	默认值	功能/备注
className	optional	-	自定义样式类
placeholder	optional	搜索	输入框提示占位符
value	optional	-	输入框的输入字符
autoFocus	optional	false	是否自动获取焦点
onChange	optional	-	输入变化后触发的事件，需要在这里变更 value 的值
onKeyDown	optional	-	key down时触发事件，回传keyCode和value值

Links 相关链接

• Fire a bug/Issues 提Bug
• Tingle项目