Question

这是我的代码：

export type State = {hddstate: string, cpustate: string};
export type Properties = {};


export class SearchComponent extends React.Component<Properties, State> {
private inputTimer?: number;

constructor(properties: Properties) {
    super(properties);

    this.state = {
        hddstate: "turned off",
        cpustate: "turned off"

    };
}

public CpuStatus(): void {
    this.setState({hddstate: "turned off"});
    this.setState({cpustate: "turned on"});
}

当我调用CpuStatus（）时，出现“未捕获的TypeError：无法读取未定义的属性'setState'”

为什么会发生这种情况，我该如何解决？

Answer 1

在JavaScript中，默认情况下未绑定类方法。

您需要在构造函数中绑定您的方法。可以通过将以下代码行添加到构造函数中来完成此操作： this.CpuStatus = this.CpuStatus.bind(this);

“如果使绑定烦恼，您有两种方法可以解决此问题。”正如@Murat建议的那样，“如果使用实验性的公共类字段语法，则可以使用类字段正确地绑定回调。” -https://reactjs.org/docs/handling-events.html

Answer 2

您需要绑定函数，否则this将是未定义的，例如带有胖箭头符号

public CpuStatus = (): void => {
    this.setState({ hddstate: "turned off" });
    this.setState({ cpustate: "turned on" });
}

未捕获到的TypeError：无法使用函数读取未定义的属性“ setState”

2 个答案: