在一个 React 组件中,我想向 Redux reducer 发出一个 Action ,该 redux reducer 在按下按钮时执行 API 调用。
成功执行此 API 调用后,我希望我的 reducer 将调用已成功执行的消息分派(dispatch)到我的组件。
我的组件将接收此调度作为 prop(例如 this.props.successfullyUpdated
)并将呈现窗口警报。
例如在我的渲染函数中,
render() {
if (this.props.successfullyUpdated) {
return renderSuccessAlert();
}
}
我面临的问题是我希望在每次 API 执行后只显示一次此警报。所以在警报被调用之后,我不希望它再次被调用,直到 Redux 调度另一个 successfullyUpdated
Prop 。
现在,一旦 successfullyUpdated
成为 props 的一部分,警报就会持续呈现,即使它只通过 Redux 发送一次。我如何阻止这种情况发生,并且只按需呈现警报?
最佳答案
看起来您缺少将 successfullyUpdated
设置回 false
的函数。
一旦我们进入 if
语句并且 successfullyUpdated
评估为 true
,您需要将其设置为 false
.
render() {
if (this.props.successfullyUpdated) {
this.props.setUpdatedFalse();
return renderSuccessAlert();
}
}
关于javascript - 使用 Redux 让 React 组件执行一次性操作?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49309383/