Question

我这里有这样的代码

 h(e) {
        console.log(e.target.value);
        this.setState(state => {
            return {editData: e.target.value};
        });
    }

但是它不起作用。 e-事件-在setState函数中为null。可以这样做吗？

Answer 1

如Antuan所述，使用箭头功能，可以避免此绑定问题。

尝试

handleChange = e => { 
          this.setState({ 
    editData: e.target.value 
    })
   }

没有看到其余的代码或状态，但我希望这就是您想要的。

我想您喜欢输入字段或试图从中获取价值的东西。另外，我建议给您的函数起更好的名称，以使它们的作用更加明显。请确保将初始状态设置为空值或默认值，以避免遇到状态被初始化为null的问题（我认为是在您未设置初始状态的情况下）

编辑2：我刚刚在我的答案注释中学到了一些新知识，这是在解决您的实际问题，为什么您会得到空值。当您将回调编写为函数而不是对象时，它不是立即且异步的。而且，当它想要访问您的综合事件时，它已经不复存在了。感谢您指出@DennisMartinez 我希望我不会对这个解释有任何误解或解释，这是有道理的。

编辑：还要在要使用该功能的元素上设置onChange={this.handleChange}

欢呼

Answer 2

任何事件处理程序（例如onChange，onClick，onMouseDown）都必须使用以下箭头函数进行绑定：

h = e => {
    your code here
}

或通过将其绑定到构造函数中：

constructor(props){
  super(props)

  this.h = this.h.bind(this)
}

您不需要绑定未附加到事件的函数，例如。

{this.renderDescritption()}

还要确保将状态值传递给输入元素。

<input name="firstname" onChange={this.h} value={this.state.editData} />

Answer 3

答案在这里：要获取事件，我应该在我的方法中使用event.persist（）。