Reactjs 如何使Snackbar再次打开？

我创建了一个

Snackbar

组件

import React，{Component}来自'React'；
从“@material ui/core”导入{Snackbar，IconButton}；
从“@material ui/icons/Close”导入CloseIcon；
接口警报道具{
消息：字符串；
}
接口警报状态{
开放：布尔；
}
导出默认类警报扩展组件{
构造函数（道具：AlertProps）{
超级（道具）；
此.state={
开放：是的
};
this.handleClose=this.handleClose.bind（this）；
}
handleClose（事件：React.SyntheticEvent | React.MouseEvent，原因？：字符串）{
如果（原因！==‘单击离开’）{
这是我的国家({
开放：假
});
}
}
render（）{
返回(
)
}
}

然后，当提交表单时遇到错误时，我以编程方式将其添加到呈现中

let警报：反应节点；
if（this.state.error）{
警报=；
}

问题是

Snackbar

仅在第一次遇到错误时才会打开。如果用户提交同一表单两次，则不会打开

Snackbar

---

我知道这是因为

this.state.open=false

是由

onClose

方法设置的，但是在再次提交表单之前如何“重置”此状态呢？

一种方法是，您可以稍微改变方法，并始终呈现

警报，即

<Alert message={this.state.error} open={this.state.open} onClose={()=>{this.setState({open:false})}}/>

{this.setState（{open:false}}}/>

同时将
open
状态变量从
Alert
的状态移动到其父变量。因此，在
Alert
中，始终使用props中的
open
值。现在，只要父级中的
open
发生更改，
Alert
将正确重新呈现