Typeahead内部的On Change事件不工作

Question

我试图检查Onchange事件是否在typeahead内工作，但显然，它不是。下面是代码:

class Search extends Component {
state = {
searchName: ''
}
handleNameChange(event) {
this.setState({searchName: event.target.value})
console.log('Name Change: ', event.target.value);
}
render() {
return (
<div class="form-group">
<Typeahead
id="basic-example"
options={this.state.hcpName}
placeholder="Search by Name..."
onChange={this.handleNameChange}
/>
</div>
)}
}

这段代码有什么问题?当我输入该字段时，在控制台中看不到任何内容。

Answer 1

我找到了一种直接改变状态而不是调用函数的方法。方法如下:

class Search extends Component {
state = {
searchName: ''
}

render() {
return (
<div class="form-group">
<Typeahead
id="basic-example"
options={this.state.hcpName}
placeholder="Search by Name..."
onInputChange={(searchName) => this.setState({searchName})}
/>
</div>
)}
}

基本上，我使用onInputChange而不是onChange，然后直接在typeahead中改变状态。