如何从Ecmascript 6(ES6）上类对象中的事件回调函数访问对象成员

How to access an object member from event callback function in a class object on Ecmascript 6 (ES6)

本文关键字：对象 事件 回调 成员 访问 函数 Ecmascript ES6      更新时间：2023-09-26

我得到了这个：

class Register {
    render(){
        return (<div onchange={this.aFunction}></div>)
    };
    aFunction(event){
        this.printSomething();  //Uncaught TypeError: undefined is not a function
    }
    printSomething(){
        console.log('Horray');
    }
}

如何从aFunction中调用printSomething？Es6真的让我很困惑。

谢谢。

您会注意到，当将ES6类与React一起使用时，情况发生了很大变化。

此外，ES6类不会像ES5React.createClass那样自动绑定。

因此，您需要正确绑定函数的this

你有两个选项

1.使用箭头功能

render(){
    return <div onchange={event => this.aFunction(event)}></div>;
}

2.使用绑定

render(){
    return <div onchange={this.aFunction.bind(this)}></div>;
}

我想你使用的是React.js。如果你是，你需要更新

class Register

至

class Register extends React.Component

我认为问题是render上的this绑定在div上。

var foo = new Register;
var div = foo.render();
div.onchange(); // this is div, not foo
foo.aFunction(); // doesn't throw TypeError.
相关文章：