正在更改Redux状态，但使用mapStateToProps时道具未定义

Question

我在我的应用程序中使用React-redux，我遇到了这个问题，我使用connect(mapStateToProps,mapDispatchToProps)(Component)并且能够成功地使用映射的调度来操作redux状态。 使用开发工具我看到状态已成功更改，但映射的props在任何组件中始终未定义。

我正在尝试的示例组件：

class DashboardPage extends React.Component {
  componentWillMount() {
    console.log(this.props.idToken);
  }
  render() {
    return (
        <div>
            <div className="dashboard-container">
                <p>{this.props.idToken}</p>

                <button onClick={() =>  {this.props.logout()}}>
                    LOGOUT
                </button>
            <button onClick={() =>  {browserHistory.push('/app/play')}}>
                    PLAY
                </button>
            <button onClick={() =>  {this.props.setIsLoading(true)}}>
                    TEST
                </button>
            </div>
        </div>
    );
  }
}

const mapStateToProps = (state) => {
  return {
    idToken: state.idToken,
  };
};

export default connect(mapStateToProps, { logout, setIsLoading })(DashboardPage);

但是，这之前一直在努力。 我暂时从代码中休息了一段时间，所以我不记得我改变了什么来打破这个，但我很确定它与React路由器有关，所以这里是我的路线：

export default (
    <Route path="/" component={App}>
        <Route path="app" component={Authorized}>
            <IndexRedirect to="/app/dashboard"/>
            <Route path="dashboard" component={DashboardPage} />
            <Route path="play" component={PlayPage}/>
        </Route>
        <Route path="login" component={Login} />
    </Route>
);

我基本上使用App作为主容器，我在其中调用thunk动作来检查localStorage中是否有令牌，然后如果是，则重新应用令牌状态的调用和操作（成功登录时调用相同的操作）。 在重新应用状态之前，此操作会将用户重定向到/app/dashboard ，如果localStorage中没有保存凭据，则应用会自动重定向到/login 。

我的index.js ：

const appRoot = document.getElementById('app-root');

const store = createStore(reducers, compose(
    applyMiddleware(thunk),
    window.devToolsExtension ? window.devToolsExtension() : f => f
));

ReactDOM.render(
  <Provider store={store}>
    <Router history={browserHistory} routes={routes} />
  </Provider>
  , appRoot);

我有什么错误的路由，这使得mapStateToProps没有正确返回道具？

在此先感谢您的帮助。

编辑：我刚刚编辑了我的mapStateToProps ，以查看状态是否通过：

const mapStateToProps = (state) => {
  console.log(state);
  return {
    idToken: state.idToken,
  };
};

并且日志输出undefined

Answer 1

当您更新状态时，我觉得您没有在reducer中添加以前的状态。 例如，如果您的新状态是return {action.something}，那么它可能是{... state，action.something}。 我有这样的问题。 我不是专家，仍在工作和学习。