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

Question

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

3

我有一个类级别变量，想要在我的函数中访问它。我以为这个变量可以像全局变量一样使用，但我还是新手。这是我现在的简化代码，但它不起作用：

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 语句中。我遇到的错误是未捕获的 TypeError: Cannot read property 'isAdmin' of null。

我猜测 this 是未定义的，但我不确定怎么会这样。在构建之前，VS 中没有任何错误。我可以进入 _checkAdmin 函数，所以看起来 this 在那里是有效的。我需要给 _checkAdmin 传递参数吗？

- cooper

2个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- cooper · Answer 1

忘记绑定 this

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");
        }
    }
}

- asvetly · Answer 2

正如Cooper所说，你忘记绑定this了。但是如果你使用箭头函数，你就不用担心这个问题：

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");
        }
    }
}