Question

这是我的reducer代码，

export default function homeReducer(state = {}, action){
  switch(action.type){
    case types.GET_USER_DATA_SUCCESS:
      return Object.assign({}, state, action.user);

    case types.GET_MEDIA_FOR_USER_SUCCESS:
      return Object.assign({}, state, action.medias);

    default:
      return state;


  }
}

现在用户是medias的对象，是一个对象数组。

现在，当我将媒体传递给我的组件时，

function mapStateToProps(state, ownProps){
  return {
    user: state.home,
    medias: state.home
  };
}

针对此代码，我收到验证错误

HomePage.propTypes = {

  user : PropTypes.object.isRequired,
  medias: PropTypes.array.isRequired
};

Warning: Failed propType: Invalid prop `medias` of type `object` supplied to `HomePage`, expected `array`. Check the render method of `Connect(HomePage)`.

我似乎无法理解我在这里做错了什么。

Answer 1

尝试更改

Object.assign({}, array)

要

 [...array]

Answer 2

试试这个......

export default function homeReducer(state = { user: {}, media: [] }, action){
  switch(action.type){
    case types.GET_USER_DATA_SUCCESS:
      return Object.assign({}, state, { user: action.user });

    case types.GET_MEDIA_FOR_USER_SUCCESS:
      return Object.assign({}, state, { media: action.medias });

    default:
      return state;
  }
}

则...

function mapStateToProps(state, ownProps){
  return {
    user: state.home.user,
    medias: state.home.media
  };
}

确保您的action.medias确实是一个数组。

如何从Reducer中调度数组

2 个答案: