Question

大家好，我正在尝试使用 Cognito 身份验证和 redux 来设置一个基本的 React 应用程序。

这是我的行动

# Configure Virtualenvwrapper.
RUN echo -e '\
# Virtualenvwrapper configuration.\n\
export WORKON_HOME=\$HOME/.virtualenvs\n\
export PROJECT_HOME=\$HOME/Devel\n\
source /usr/local/bin/virtualenvwrapper.sh\
' >> /home/docker/.bashrc

我在我的 app.js 文件中调用它

 export function getSession() {
  return async (dispatch, getState) => {
    
    console.log('get session before',  getState().authReducer)
    return getSessionService()
      .then((response) => {
        console.log('good good ', response)
        dispatch({
          type: types.AUTH_SESSION_SUCCESS,
          payload:response
        });
        console.log('get session after',  getState().authReducer)
        console.log('get session response',  response)
      })
      .catch((error) => {
        dispatch({
          type: types.AUTH_SESSION_FAILURE
        });
        console.log('get session error',  error)
        throw error;
      });
  };
}

这是我的 authReducer：

function App() {
  const theme = useSelector((state) => state.themeReducer);
  const dispatch = useDispatch();

  React.useEffect(() => {
    dispatch(getSession())
    
  }, []);  
  ...
  ...

我还有一个 AuthGuard 组件来管理受保护的路由，如下所示：

export default (state = {}, action) => {
  switch (action.type) {
    case types.AUTH_SESSION_SUCCESS:
      {
        console.log('AUTH_SESSION_SUCCESS ', action.payload)
        return {
          ...state,
          user: action.payload.user,
          session:action.payload.session,
          attributes:action.payload.attributes,
          authenticated: true
        };
      }
    case types.AUTH_SESSION_FAILURE:
      {
        console.log('AUTH_SESSION_FAILURE')
        return {
          ...state,
          authenticated: false
        };
      }
    default:
      return state;
  }
};

这里的问题是我的 AuthGuard 没有重新渲染，所以即使用户正确地通过了身份验证，用户也总是被重定向到 /auth/sign-in

感谢您的帮助

更新1：当我删除 AuthGuard 组件中的条件时，该组件会重新渲染两次并更新良好状态

Redux 状态更新后组件未重新渲染 - Redux Hooks - useSelector()

0 个答案: