Javascript 我的reducer似乎没有修改存储中的状态以允许我的React视图再次渲染

首先，我应该提到，我遵循了这个模式，我将在我的项目中向您展示另外两组React组件

出于某种原因，它似乎不起作用，我重点讨论了

@connect

或减速器是问题所在。我已经让几个人检查了这个问题，我尝试了几种不同的方法来解决这个问题

import classNames from 'classnames';
import SidebarMixin from 'global/jsx/sidebar_component';

import Header from 'common/header';
import Sidebar from 'common/sidebar';
import Footer from 'common/footer';
import AppList from '../components/lists';

import { connect } from 'react-redux'

import actions from 'redux/actions';
import { VisibilityFilters } from 'redux/actions/actionTypes';

@connect((state) => state)
  class AppContainer extends React.Component {
    constructor(props) {
      super(props)
  }
  componentWillMount() {
    this.props.dispatch(actions.getUnconsidered(1));
    this.props.dispatch(actions.getConsidered(3));
    this.props.dispatch(actions.getInterviews(4));
    this.props.dispatch(actions.getOffers(2));
  }

这里就是调度四个操作来获取应用程序的数据。我们使用Redux Thunk中间件来处理与发出这些Ajax请求相关的异步问题

我发现所有这些Ajax调用的数据都到达了reducer

render() {

console.log("AppContainer state", this.props);

此console.log应记录两次。。。在第一次渲染时为空，在还原器之后状态更改时再次为空，还原器应显示状态以及映射到道具的我的数据，因为

@connect

我相当肯定这一点，因为我的其他观点，我已经做了

    return (
      <div>
        <Container id='body'>
          <Grid>
            <Row>
              <Col md={3}>
                <AppList data={this.props.unconsidered}/>
              </Col>
              <Col md={3}>
                <AppList data={this.props.considered} />
              </Col>
              <Col md={3}>
                <AppList data={this.props.interviews} />
              </Col>
              <Col md={3}>
                <AppList data={this.props.offers} />
              </Col>
            </Row>
         </Grid>
       </Container>
     </div>
     )
   }
 }

@SidebarMixin
export default class extends React.Component {
render() {
const dispatch = this.props.dispatch
    var classes = classNames({
        'container-open': this.props.open
    })
    return (
        <Container id='container' className={classes}>
            <Sidebar />
            <Header />
            <AppContainer />
            <Footer />
        </Container>
    )}
   }

这是我的减速器文件，我相信我的问题就在这里

import {GET_UNCONSIDERED,
          GET_CONSIDERED,
          GET_INTERVIEWS,
          GET_OFFERS } from '../actions/actionTypes';


function empdashboard(state = {}, action) {
    console.log("state in dashboard reducer = ", state);
    switch (action.type) {
        case GET_UNCONSIDERED:
            console.log("unconsidered:", action.payload)
            const unconsidered = action.payload.data;
            return Object.assign({}, state, {
                unconsidered: unconsidered
            });
        case GET_CONSIDERED:
            console.log("considered:", action.payload)
            const considered = action.payload.data;
            return Object.assign({}, state, {
                considered: considered
            });
        case GET_INTERVIEWS:
            console.log("interviews:", action.payload)
            const interviews = action.payload.data;
            return Object.assign({}, state, {
                interviews: interviews
            });
        case GET_OFFERS:
            console.log("offers:", action.payload)
            const offers = action.payload.data;
            return Object.assign({}, state, {
                offers: offers
            });
        default:
            return state;
    }
}

module.exports = {
    empdashboard: empdashboard
}

老实说，我的印象是，要么我的减速器坏了，要么我的

@connect

有一个bug，它没有检测到状态的变化来重新启动我的视图

---

谢谢你看这个

请创建一个[最小、完整且可验证的示例（），尤其是最小部分。删除不必要的代码后，您的问题将更容易回答。只是一个友好的提示，您可能希望阅读本页：这样您就可以始终确保您的问题易于回答且尽可能清楚。请确保包括您为解决问题所做的任何努力，以及当您尝试这些修复时发生了什么。也不要忘记显示代码和任何错误消息！减速器中的

控制台.log

是否使用正确的操作类型正确记录？它记录正确。每个新的控制台.log也正确记录，因为有4个请求。“仪表板减速器中的状态”正确记录上一个状态。例如，当GET_Severed案例激发时，在该状态中包含未考虑的数据之前。请创建一个[最小、完整且可验证的示例（），尤其是最小部分。删除不必要的代码后，您的问题将更容易回答。只是一个友好的提示，您可能希望阅读本页：这样您就可以始终确保您的问题易于回答且尽可能清楚。请确保包括您为解决问题所做的任何努力，以及当您尝试这些修复时发生了什么。也不要忘记显示代码和任何错误消息！减速器中的

控制台.log

是否使用正确的操作类型正确记录？它记录正确。每个新的控制台.log也正确记录，因为有4个请求。“仪表板减速器中的状态”正确记录上一个状态。例如，当GET_Severed案例激发时，就在该状态包含未考虑的数据之前。

import {GET_UNCONSIDERED,
          GET_CONSIDERED,
          GET_INTERVIEWS,
          GET_OFFERS } from '../actions/actionTypes';


function empdashboard(state = {}, action) {
    console.log("state in dashboard reducer = ", state);
    switch (action.type) {
        case GET_UNCONSIDERED:
            console.log("unconsidered:", action.payload)
            const unconsidered = action.payload.data;
            return Object.assign({}, state, {
                unconsidered: unconsidered
            });
        case GET_CONSIDERED:
            console.log("considered:", action.payload)
            const considered = action.payload.data;
            return Object.assign({}, state, {
                considered: considered
            });
        case GET_INTERVIEWS:
            console.log("interviews:", action.payload)
            const interviews = action.payload.data;
            return Object.assign({}, state, {
                interviews: interviews
            });
        case GET_OFFERS:
            console.log("offers:", action.payload)
            const offers = action.payload.data;
            return Object.assign({}, state, {
                offers: offers
            });
        default:
            return state;
    }
}

module.exports = {
    empdashboard: empdashboard
}