reactjs - 在 typescript 类中设置未定义的属性

Question

我有一个看起来像这样的类

export class TestScreen extends Component<any, LoginScreenState> {
  private wallet: Wallet;

  async connect() {
    this.wallet = WAL.accessContext.initWallet(getWalletProviders()[0]);
    ....
  }

render() {
    return (
        <div>
            <button onClick={this.connect}>Connect</button>
            <br />
        </div>
    );
    }
}

我得到以下错误

Unhandled Rejection (TypeError): Cannot set property 'wallet' of undefined

我理解该错误，但我不确定此处使用的正确模式是什么。我只想在运行 connect() 时设置该值。

我不想将对象初始化为一些垃圾，然后用以太替换它。感觉我在这里遗漏了一些明显的东西。

Answer 1

this 在 TypeScript 中可能非常棘手。 this 行为实际上来自 JavaScript，正如 @ecraig12345 在评论中指出的那样。传递方法的引用时，在某些情况下会丢失上下文。 This answer提供了很好的解释。您还可以在 TypeScript documentation 中了解更多相关信息.

对于您的情况，我建议您执行以下操作。这是一种非常常见的语法。

onClick={e => this.connect(e)}