1.修改类 方法中的this指向
(1)bind方法
import React from 'react';
class A extends React.Component<IProps, IState> {
handleClick(){
console.log(this);
}
render(){
return <div onClick={this.handleClick.bind(this)}></div>
}
}
(2) 创建箭头函数(常用)
import React from 'react';
class A extends React.Component<IProps, IState> {
handleClick=()=>{
console.log(this);
}
render(){
return <div onClick={this.handleClick}></div>
}
}
(3) 在constructor中提前对事件进行绑定
import React from 'react';
class A extends React.Component<IProps, IState> {
constructor(props) {
super(props);
this.state = {date: new Date()};
this.handleClick=this.handleClick.bind(this);
}
handleClick(){
console.log(this);
}
render(){
return <div onClick={this.handleClick}></div>
}
}
(4) 将事件调用的写法改成箭头函数形式(不推荐)
import React from 'react';
class A extends React.Component<IProps, IState> {
handleClick(){
console.log(this);
}
render(){
return <div onClick={()=>this.handleClick()}></div>
}
}