导航到不同路线时的清除状态

Question

我在login.js中有这个，我试图使用错误的密码来触发它。

{this.props.msg && <MessageBanner content={this.props.msg} />}

但是当消息出现时，我尝试导航到signup.js，它也具有相同的功能

{this.props.msg && <MessageBanner content={this.props.msg} />}

消息不会消失。或者我在signup.js页面，出现错误，我点击浏览器，错误没有消失。

无论如何在使用react-router导航时清除状态？

Answer 1

听起来你需要正确设置一个“切换”系统来显示你有这个错误信息......

MessageBanner是否有关闭按钮？如果是这样，你会想要附上一个

onClick={this.setState=({toggleErrorMessage: !this.state.toggleErrorMessage})}

//点击反转无论this.state.toggleErrorMessage当前是... //所以如果当前为true，点击后将为false。

然后你可以做更像这样的事情。

{this.state.toggleErrorMesage ? this.props.msg && <MessageBanner content={this.props.msg} /> : undefined }

//如果toggleErrorMessage为true，则显示msg和banner ...