Reactjs 如何在React中创建一个结构，防止一个动作在完成之前传递给另一个动作？

当我发出api请求时，我将返回的数据保存在redux存储中，然后在路由中使用这些数据

我想做的是在将组件安装到路由上之前对其进行授权，但我无法授权，因为路由中的数据未定义。尤其是当我刷新页面时，它变得未定义

那么，如何防止

currentUser

在加载之前呈现

路由

我应该如何解决这个问题？ 有解决这个问题的工具吗

组件安装

componentDidMount(){
    this.props.actions.getCurrentUser()
  }

路由器

重定向到此，因为

currentUser

最初未定义

<Route exact path="/profile/:id/settings" render={(props) => {
            var urlId = props.match.params.id;
        return this.props.isLogged ? this.props.currentUser.id == urlId ? < ProfileSettings {...props} /> : <Redirect to={"/profile/" + urlId} /> : <Redirect to="/" />;
          }
   } />

getCurrentUserApi

export function getCurrentUserApi() {
    return async (dispatch, getState) => {
        if (localStorageHelper.isExistsToken()) {
            if (Object.keys(getState().currentUserReducer).length == 0) {
                await axios.get(CURRENT_USER_PATH, {
                    headers: localStorageHelper.authHeaderObj()
                }).then(res => {
                    dispatch(authActionsCreators.currentUserSuccess(res.data))
                    dispatch(authActionsCreators.isLoggedTSuccess())
                }).catch(err => {
                    if (err.response.status === 401) {
                        var refreshToken = bindActionCreators(refreshTokenApi, dispatch)
                        refreshToken();
                    }
                })
            }
        }
    }
}

---

一种方法是让

getCurrentUserApi

操作分派一个设置加载标志的操作，当设置该标志时，您不会转发，而是显示加载。另一种方法是在本地状态下设置加载标志，并在获取当前用户时将其切换：

this.props.actions.getCurrentUser（）。然后（user=>将加载标志设置为false）

第一种方法，我将在axios调用之前放置类似于中间件的东西，执行类似的操作<代码>调度（authActionsCreators.currentUserLoading（））并在成功和失败还原器上将加载设置为false。我知道了，谢谢，我会试试这个。它成功了，非常感谢。

export function getCurrentUserApi() {
    return async (dispatch, getState) => {
        if (localStorageHelper.isExistsToken()) {
            if (Object.keys(getState().currentUserReducer).length == 0) {
                await axios.get(CURRENT_USER_PATH, {
                    headers: localStorageHelper.authHeaderObj()
                }).then(res => {
                    dispatch(authActionsCreators.currentUserSuccess(res.data))
                    dispatch(authActionsCreators.isLoggedTSuccess())
                }).catch(err => {
                    if (err.response.status === 401) {
                        var refreshToken = bindActionCreators(refreshTokenApi, dispatch)
                        refreshToken();
                    }
                })
            }
        }
    }
}