事件处理程序上的React Cant Access类范围[重复]

Question

我试图创建一个反应组件，这是一个文本输入。当有人按下回车键时，必须调用mymethod（）。但是在handleKeyPress，我不能访问类范围。我怎样才能解决这个问题？

class MyContainer extends Component {
    constructor(props, context) {
        super(props, context);        
    }

   myMethod(){}


    handleKeyPress(target) {
        var self = this;
        if(target.charCode === 13) {
            this.myMethod();
        }
    }

    render() {
        <input onKeyPress={this.handleKeyPress}  ref={(input) => this.inputMax = input} type="text" />
    }
}

Answer 1

您需要在构造函数中绑定函数。

constructor(props, context) {
    super(props, context);
    this.handleKeyPress = this.handleKeyPress.bind(this)
}

Answer 2

您需要绑定处理程序。

class MyContainer extends Component {
    constructor(props, context) {
        super(props, context);
        this.handleKeyPress = this.handleKeyPress.bind(this);
    }

   myMethod(){}


    handleKeyPress(target) {
        var self = this;
        if(target.charCode === 13) {
            this.myMethod();
        }
    }

    render() {
        <input onKeyPress={this.handleKeyPress}  ref={(input) => this.inputMax = input} type="text" />
    }
}

另一种解决方案是使用箭头函数（有性能缺陷）或@autobind装饰器