我想通过在input
中输入的placeid过滤并显示数组。
当我输入1
时,我可以显示有胎儿1
的阵列。
然而,在那之后,如果我输入2
,什么都没有出现。
我的代码是这样的。
class List extends Component {
constructor(props) {
super(props)
this.state = {
val: ''
}
}
_filterVal = e => {
this.setState({ val: e.target.value })
}
handleSetFilter = async () => {
this.props.handleFilterVal(this.state.val);
}
render() {
return (
<div id="content">
<div>
<li>List</li>
<input
type="text"
defaultValue=""
onKeyUp={this._filterVal}
/>
<button onClick={this.handleSetFilter} className='Filter'>Filter</button>
{ this.props.checkins.map((checkin, key) => {
return(
<div key={key}>
<p>Placeid:{checkin.placeid}: ---- </p>
</div>
)
})}
</div>
</div>
);
}
}
export default PlaceList;
...
handleFilterVal(val) {
const line = this.state.lists.filter((item => {
return item.placeid.search( val ) !== -1;
}))
this.setState({
lists: line
});
}
...
另外,我想在没有输入时显示所有数组。
你能给我任何建议吗?