Question

我是react-redux的新手。在这里，我有一个按钮，就像，

<button className="btn btn-primary fetchBtnSize"
            disabled={this.state.disableFetchQuestion}
            onClick={() => this.fetchQuestions()}>
            Fetch Questions
                </button>
        </div >

现在，通过这种方法

fetchQuestions() {   this.props.fetchQuestions(result); }

现在在我的行动中，

export function fetchQuestions(arrayOfQuesObjs) {
    return (dispatch) => {
        dispatch({
            type: REQUEST_INITIATED
        });
        post(FETCH_QUESTIONS_URL, arrayOfQuesObjs)
            .then((response) => {
                if (response.status === 200) {
                    dispatch({
                        type: REQUEST_SUCCESSED,
                    });
                    history.push('/quiz-questions');
                    dispatch({
                        type: FETCHING_QUESTIONS_SUCCESS,
                        data: response.payload,
                    })
                }
                else {
                    dispatch({
                        type: REQUEST_SUCCESSED
                    });
                    toastr.error(response.status.message);
                    dispatch({
                        type: FAILED_QUESTIONS_FETCHING,
                        data: response.status,
                    });
                    if (response.status === 401) {
                        toastr.error("Please login again");
                        localStorage.clear();
                        history.push('/');
                    }
                }
            })
    }
}

因此，这里仅在成功之后，我会将用户重定向到quiz-questions page。

现在，我正在渲染一个组件。

现在，发生的事情是，当用户单击quiz-questions的重新加载页面时，从服务器获取的数据丢失了。因为状态被清除了。现在，我所做的就像，

on history.push({ pathName: '/quiz-questions', state : { data: 1, isfetch: true   }})

因此，当我单击“重新加载”按钮时，我将从props.location.state.data

中获取数据

然后

componentDidMount() { this.props.fetchQuestions(props.location.state.data);  }

现在，这是怎么回事，单击button时，如果我删除了api调用，并将该用户重定向到/quiz-questions，如果api失败了，那么用户应该在{{ 1}}

因此，我不知道在何处将此称为previous page only。如果我在两个地方都放，则API。所以，我该如何解决呢？

Answer 1

在任何情况下，重载后Redux存储中的数据均不会保留。您需要逻辑上处理这种情况。看看this教程。您应该以这种方式管理数据流。

为简短起见，即使在重新加载后，您在多条路由上所需的任何数据也应在生命周期挂钩中的new的App（父组件）Component中获取。另外，如果可能，请始终尝试componentDidMount()，因为它不会导致路由更改时数据丢失。希望有帮助，祝您好运！

调用API的componentDidMount或单击按钮时

1 个答案: