如何处理“无法读取未定义的属性‘映射’”react/redux

我再一次面临一个非常常见的错误"Cannot read property 'map' of undefined"。我有一个项目（电影）的初始列表，在 a 中正确加载<ul><li></li></ul>。但是，在通过单击按钮发送我的操作后，错误发生了。我实际上可以在我的 redux 开发工具中看到更新的状态（即使有错误），但我也可以看到更改不会影响我的 React 开发工具中的存储状态。

这是我的减速器：

export default function moviesReducer(state = {items}, action) {
  if(action.type === 'SET_MOVIES_FILTER') {
    return update(state.items, {$splice: [[1,3]]})
  }
    return state;
  }

这是我的物品清单（来自这里post https://stackoverflow.com/questions/38133137/how-to-filter-and-sort-the-same-array-of-object-state-in-redux/38151733#38151733) :

let items = [{
  title: 'Mad max',
  year: 2015,
  rating: 8,
  genre: 'fantasy',
}, {
  title: 'Spider man 2',
  year: 2014,
  rating: 7,
  genre: 'fantasy',
}, {
  title: 'Iron man 3',
  year: 2013,
  rating: 7,
  genre: 'fantasy',
}, {
  title: 'Dumb and Dumber To',
  year: 2014,
  rating: 5,
  genre: 'comedy',
}, {
  title: 'Ted 2',
  year: 2015,
  rating: 6,
  genre: 'comedy',
}];

这是我的行动：

export const SetMoviesFilter = () => {
  return {
    type: 'SET_MOVIES_FILTER'
  };
};

这是我的组件：

const movieTable = ({testmovie, movieTable }) => {

        return (

        <div>
            <button onClick={movieTable}>testbutton</button> 
            <ul>
            {testmovie.map((m, i) =>
        <li key={i}>{m.year} - {m.title}.({m.genre}) - {m.rating}</li>
      )}
            </ul>
        </div> )
    }

function mapStateToProps(state) {
  return {
      testmovie: state.moviesReducer.items

  };
};


const mapDispachToProps = (dispatch) => {
    return {
  movieTable: () => {dispatch (SetMoviesFilter());
        },
    };
};


const AppMovie = connect(mapStateToProps, mapDispachToProps)(movieTable);

我哪里错了？我应该怎么办 ？我不知道这是否相关，但我无法做出我的jsbin https://jsbin.com/qolede/edit?html,console,output work.

thanks.

您的初始状态为state.moviesReducer.items is undefined.

在你的减速机中export default function moviesReducer(state = {items}, action),检查一下这是哪里items来自（哪里。最有可能的是undefined当商店初始化时。您可以给它一个初始值[]

您还可以通过包装来避免此问题<ul>在 if 语句中

if (testmovie) {
  // do your testmovie render here.
}

Edit:

看起来您的减速器映射正确。所以state.moviesReducer总是被定义的。

如果您的初始项目列表甚至无法正确加载，则意味着您的items对象导致了错误。

如果您的初始列表加载正确，并且仅在您分派列表后才会发生错误SET_MOVIE_FILTER行动，意味着你的update(state.items, {$splice: [[1,3]]})正在改变你的状态形态。

我不知道你从哪里得到这个update功能。但我猜你应该这样做return { items: update(state.items, {$splice: [[1,3]]})}

这就是我调试代码的方式。