我有一个用户对象,他们可以在其中编辑他们的信息(电话号码、电子邮件等)
我无法在 setState
回调中访问输入的 name
并不断收到 TypeError: Cannot read property 'name' of null
但是,当我记录 event.target.name
时,它显示在那里。
当我改变一个简单的状态时,它起作用了:
假设状态值与目标名称相同。
this.setState({ [event.target.name]: value });
我正在关注 this发布以更新用户对象。
抱歉,如果这是重复的,我找不到我要找的东西。
handleUserChange(event) {
console.log(event.target.name);
const value = event.target.value
this.setState(prevState => ({
user: {...prevState.user, [event.target.name]: value }
}))
}
编辑:我像这样在类构造函数中正确绑定(bind)它:
contructor(props) {
super(props);
...
this.handleUserChange = this.handleUserChange.bind(this)
}
最佳答案
React 正在回收这个事件。因此,对 setState 的异步调用不会知道 event.target.name 的值,因为事件已经消失。您需要像处理 event.target.value 一样复制该值。
handleUserChange(event) {
console.log(event.target.name);
const name = event.target.name;
const value = event.target.value;
this.setState(prevState => ({
user: {...prevState.user, [name]: value }
}))
}
来自文档:link
其他解决方案:
handleUserChange(event) {
event.persist();
const value = event.target.value;
this.setState(prevState => ({
user: {...prevState.user, [event.target.name]: value }
}))
}
保留事件的值。
关于javascript - 类型错误 : Cannot read property 'name' of null,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46371648/