React:未捕获的TypeError:无法读取未定义的属性
2022-04-24
2086
我遇到如下问题:
class App extends React.Component {
testop(){
alert("test");
}
showAlert() {
// alert("Im an alert");
this.testop();
}
render() {
return <button onClick={this.showAlert}>show alert</button>;
}
}
运行代码时,出现错误“Uncaught TypeError: Cannot read properties of undefined (reading 'testop')”。为什么无法读取testop函数?
2个回答
问题是,您在
showAlert
中引用的
this
不是指组件的
this
,而是指内部方法
this
。
此问题有两种解决方案。
在组件的构造函数中将函数与组件的 this 绑定:
constructor (){
this.showAlert = this.showAlert.bind(this);
}
或者使用提供词法作用域的 ES6 箭头函数
Vitaliy Rayets
2022-04-24
或者尝试使用箭头函数代替绑定
showAlert = () => {
this.testop();
}
https://codesandbox.io/s/tender-ully-1ynyqm?file=/src/App.js
Piotr Glejzer
2022-04-24