在搜索按钮之后,我们有四个年份过滤器按钮,但是当我们在搜索中键入查询时,如果不存在该查询,则仍会显示以前的搜索结果。 如果查询为空,我需要清除搜索结果和过滤器。 以下是代码:
//Constructor
constructor(props) {
super(props)
this.state = {value: this.props.routing.query['q']}
this.handleChange = this.handleChange.bind(this)
}
//event
handleChange(event) {
this.setState({value: event.target.value})
this.props.setQuery(event.target.value)
this.props.setURLQuery(event.target.value)
this.props.getSearchResults()
}
//render function
<div className="container flex-container-archival">
<div className="input__wrap archivalsearch grow-2">
<input className="input input--brand" value={this.state.value} onKeyDown={this.keyPress} type="text" autoComplete="off" autoFocus placeholder="Sok pa namn, avdelning, roll etc." onChange={this.handleChange} />
<Icon iconName="search" iconBlock={true} iconClass="input__icon input__icon--right" />
</div>
<div className="container__indentation--left-only">
<Filter/>
{!this.props.isLoading &&
<Message {...this.props.message}/>
}
{!this.props.hideLoadMore &&
<LoadMore
onClick={this.getSearchResults}
disabled={this.props.isLoading}
/>
}
</div>