关于javascript:为什么即使编写了setState方法也无法更新我的状态?

 2021-04-27 

Why my state is not getting updated even after writing the setState method?

从'react'导入React,{组件}

class Columns扩展了组件{
构造函数(道具){
超级(道具)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
    this.state={
        message:'Hello'
    }
}

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

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

}
导出默认列


正如ray hatfield所说,您正在丢失this上下文,需要使用箭头功能,但是您也不会调用setState;您正在覆盖它。

删除=

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

这样说:

1
2
3
this.setState({
    message:'Welcome'
})

因为将其传递为this.changeMessage会将其与组件范围分离。当按钮调用它时," this "不再是组件。

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

如果您想了解详细信息,我曾经尝试在另一个答案中解释此范围问题。

此外,正如Aaron指出的那样,您的changeMes??sage处理程序中还有一个多余的=