传递值时的反应 Redux 重定向

Question

我正在为一个应用程序使用React Redux React路由器。我的初始页面是登录屏幕，一旦身份验证成功，希望在传递从身份验证中检索到的令牌时重定向到另一个页面。我正在查看这个SO问题，但没有显示如何将值传递到新页面：React路由器重定向

我正在考虑采纳Dan的建议，将重定向粘贴到动作创建者中（成功登录），但只是不确定如何将令牌传递回去。这是我的动作创建者：

export const loginSucceeded = token => {
    browserHistory.push('/dashboard')
}

Answer 1

使用 react-router 4，您可以尝试以下操作：

import { Route, Redirect } from 'react-router-dom';

export const loginSucceeded = token => {
    <Redirect push to={{
        pathname: '/dashboard',
        state: { token: token }
    }}/>
}

稍后，可以从仪表板页面通过< code > this . props . location . state . token 访问此令牌。

关于这里的更多信息

Answer 2

我建议使用react-router-redux。它带有< code >推送和< code >替换操作，因此您可以在< code >登录成功操作创建器中< code >分派它们。这是一个更干净的方式来处理路线的变化，你会看到在redux开发工具适当的行动。在< code>localStorage中存储一个令牌是一个好主意

假设您使用redux thunk中间件：

export const loginSucceeded = token => {
  return dispatch => {
    localStorage.setItem('token', token);
    dispatch(push('/dashboard'));
  };
};