为什么我的 state 即使在编写 setState 方法后也没有更新？

Question

从“反应”导入反应，{组件}

class 列扩展组件{构造函数（道具）{超级（道具）

    this.state={
        message:'Hello'
    }
}

changeMessage(){
    
     this.setState=({
         message:'Welcome'
    })
}

render(){
    return(
        <div>
            <div>{this.state.message}</div>
            <button onClick={this.changeMessage}>Click</button>
        </div>
    )
}

} 导出默认列

Answer 1

正如上面的 ray hatfield 所说，你失去了this上下文，需要使用箭头 function，但你也没有调用setState ； 你正在覆盖它。

删除=从

this.setState=({
     message:'Welcome'
})

所以它说：

this.setState({
    message:'Welcome'
})

Answer 2

因为将其作为this.changeMessage sage 传递会将其与组件 scope 分离。 当按钮调用它时，“this”不再是组件。

将其更改为箭头 function: () => this.changeMessage()

如果您想了解详细信息，我过去曾尝试在另一个答案中解释此 scope 问题。

此外，正如Aaron 指出的那样，您的 changeMessage 处理程序中还有一个无关的= 。