Question

我想将ImmutableJS合并到我的React应用程序中。所以现在我的减速机看起来像这样：

import { Map } from 'immutable'

const initialState = Map({
  data: [],
  sections: []
});

const AppState = (state = initialState, action) => {
  switch (action.type) {
    case 'ADD_CONTENT':
      return state.set('data', action.response);
    case 'ADD_SECTION':
      return state.set('sections', [ ...state.get('sections'), action.payload ]);
    default:
      return state;
  }
};

export default AppState;

这一切都很好，很好。但在我的组件中，我有mapStateToProps：

const mapStateToProps = (state) => {
  const d = state.app.get('data');

  return {
    works: d.works,
    pages: d.pages,
    sections: state.app.get('sections')
  }
};

然后我想显示数据：

  {
    this.props.works.map(d => {
      return <div>d</div>
    })
  }

我正在

TypeError：this.props.works.map不是函数

当我console.log时，我得知this.props.works未定义。我该怎么办？

Answer 1

因为你正在使用Immutable JS

在mapStateToProps

中

const mapStateToProps = (state) => {
  const d = state.app.get('data');

  return {
    works: d.works,
    ...

要从d访问数据，请更改您访问数据的方式，从d.works到 d.get('works')

  return {
    works: d.get('works'),
    pages: d.get('pages'),
    sections: state.app.get('sections')
  }

Answer 2

您正在调用d.works，但未定义。我认为在你的行动中，当你传递初始状态时，你还需要定义作品

const initialState = Map({
   data: [
       works: [],
       pages: []
   ],
   sections: []
});

React Redux - 从Immutable渲染时未定义道具

2 个答案: