javascript - 使用 Redux 让 React 组件执行一次性操作？

Question

在一个 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 发送一次。我如何阻止这种情况发生，并且只按需呈现警报？

Answer 1

看起来您缺少将 successfullyUpdated 设置回 false 的函数。

一旦我们进入 if 语句并且 successfullyUpdated 评估为 true，您需要将其设置为 false.

render() {
   if (this.props.successfullyUpdated) {
       this.props.setUpdatedFalse();
       return renderSuccessAlert();
   }
}