React:无法从表单选择

时间:2016-06-09 11:42:20

标签: reactjs

我有一个像这样结构的反应组件。 我想在用户从下拉列表中选择时捕获用户的选择。

我在尝试时收到以下错误消息:

“未捕获的TypeError:无法读取未定义的属性'setState'”

我正在关注文档中的示例,所以我哪里错了?

export default class SearchPage extends Component {

....

handleChange(e) {
    this.setState({
        params: {
            ...this.state.params,
            [e.target.name]: e.target.value
        }
    })
}

render() {
    const { county, cause, activity } = this.state

    return (
        <div className="searchpage">
            <form>
               <select name="county" onChange={this.handleChange}
               .....

2 个答案:

答案 0 :(得分:3)

handleChange未绑定到该实例。您需要使用内联箭头函数来捕获this词法

<select name="county" onChange={e => this.handleChange(e)}

或(推荐方式)绑定构造函数中的方法。

constructor() {
   super();
   this.handleChange = this.handleChange.bind(this);
}

答案 1 :(得分:0)

这是另一个避免使用.bind(this)或一些装饰器绑定你的函数或者创建像()=&gt;这样的匿名函数的技巧。 MYFUNC()

handleChange => (e) { }

然后你可以根据需要使用它