带有前进和后退按钮的componentWillRecieveProps问题中的redux状态

Question

我在使用redux显示警报对话框时遇到问题。 我想在用户编辑后显示成功信息，然后显示一个表格。 我通过操作> reducer> store设置一个标志。

那我做

componentWillReceiveProps(nextProps) {

    if(nextProps.data.updated_form) {
      alert('form has been updated!');
    }
}

这种方法存在问题。 用户更新了表单，然后单击某个地方以转到其他路线，然后单击回到我的表单，该警报也会触发。

Answer 1

现有解决方案的问题在于商店的updated_form变量不会随时间变化。 因此，返回页面会重新触发警报。 一个简单的解决方案是创建另一个动作创建者以重置componentWillUnmount（）`上的那些更改。

样本存储还原器可能会这样

case 'RESET_CHANGES':
    return {...state,updated_form:null}

而且react组件将具有类似的代码

componentWillUnmount() {
     this.props.resetChanges() // assuming you have created action creator
}