Javascript 如何处理react redux应用程序中加载中断的情况

下面的示例演示了在react redux应用程序中从数据库加载数据时如何更新redux状态

learningActionDataOperationBegin

将

loading

（在减速机中）设置为

true

，然后从数据库中提取数据后，

FetchLearningActionsAccess

将

loading

设置为false。在显示数据库记录的组件内部，仅当最初加载为false时才会调用

FetchLearningActions

。我相信这是react redux应用程序的常见做法

但是，例如，如果浏览器关闭或在加载数据时internet断开连接，

加载

保持为

真

，这是一个问题，因为在下次访问页面时，

获取学习操作

将不会被调用（因为

加载

仍然为真）页面将始终在屏幕上显示

加载..

文本。我不知道该怎么处理这件事。有什么想法或建议吗

export function FetchLearningActions(submissionId) {

    var url = 'api/LearningAction/FetchLearningActions';

    return dispatch => {

        dispatch(learningActionDataOperationBegin());

        axios.get(url, { params: { submissionId } })
            .then(response => {
                console.log('Learning actions are loaded.');

                const learningActions = new schema.Entity('learningActions');

                const normalizedData = normalize(response.data, [learningActions]);
                dispatch(fetchLearningActionsSuccess(normalizedData.entities.learningActions))
            })
            .catch(error => { learningActionDataOperationFailure(error) });
    }
}

---

您需要将learningActionDataOperationFailure（error）包装为dispatch。该操作应将

isLoading

设置为false，并可能设置错误标志。现在，您可以区分应用程序发出请求的状态以及请求是否成功完成

您需要将

learningActionDataOperationFailure（error）

与dispatch打包。该操作应将

isLoading

设置为false，并可能设置错误标志。现在，您可以区分应用程序发出请求的状态以及请求是否成功完成

通常redux不会保存其状态，因此当您离开页面并返回时，状态将为空。您有这些问题是因为您坚持redux状态吗？@HMR感谢您的评论！是的，我正在保持状态…可能会发送一个操作来重置所有加载值onbeforeunload@hmr代码应该放在哪里？我使用的是react钩子。您可以在根组件中尝试一种效果，您可以使用from react redux来调度将重置任何数据加载值的操作。通常redux不会保存其状态，因此当您离开页面并返回时，状态将为空。您有这些问题是因为您坚持redux状态吗？@HMR感谢您的评论！是的，我正在保持状态…可能会发送一个操作来重置所有加载值onbeforeunload@hmr代码应该放在哪里？我使用的是react钩子。您可以在根组件中尝试一种效果，您可以使用from react redux来调度将重置任何数据加载值的操作。