Question

我有一个我希望能够在我的函数中访问的类级变量。我认为这就像一个全局变量，但我是新手。这是我现在所使用的简化代码：

class People extends React.Component<PeopleProps, {}> {
    public isAdmin: boolean = false;
    public render() {
        return <div onClick={this._checkAdmin}>Call function</div>;
    }

    private _checkAdmin() {
        if (this.isAdmin) {
            console.log("is admin");
        }
    }
}

if语句发生错误。我得到的错误是Uncaught

TypeError：无法读取属性＆＃39; isAdmin＆＃39;为null

我假设this未定义，但我不确定如何发生这种情况。在构建之前，VS中没有错误。我可以使用_checkAdmin函数，因此似乎this正在那里工作。我是否需要将参数传递给＆＃39; _checkAdmin＆＃39;？

Answer 1

错过了绑定

class People extends React.Component<PeopleProps, {}> {
    public isAdmin: boolean = false;
    public render() {
        return <div onClick={this._checkAdmin.bind(this)}>Call function</div>;
    }

    private _checkAdmin() {
        if (this.isAdmin) {
            console.log("is admin");
        }
    }
}

Answer 2

正如所说的库珀，你忘了绑这个。但是如果你使用箭头函数，你就不在乎了：

class People extends React.Component<PeopleProps, {}> {
    public isAdmin: boolean = false;
    public render() {
        return <div onClick={this._checkAdmin}>Call function</div>;
    }

    private _checkAdmin = () => {
        if (this.isAdmin) {
            console.log("is admin");
        }
    }
}

如何在React / TypeScript中访问类元素变量

2 个答案: