React-Redux计数器状态管理

Question

我正在使用Redux在此项目中实现基本的Like计数器/示例

https://codesandbox.io/s/github/mralwin/Reduxstagram

这是以下用于管理点赞状态增加的代码

动作

export function increment(index) {
  return {
    type: "INCREMENT_LIKES",
    index
  };
}

减速器

function posts(state = [], action) {
  switch (action.type) {
    case "INCREMENT_LIKES":
      const i = action.index;
      return [
        ...state.slice(0, i), // before the one we are updating
        { ...state[i], likes: state[i].likes + 1 },
        ...state.slice(i + 1) // after the one we are updating
      ];
    default:
      return state;
  }
}

Component

<button onClick={this.props.increment.bind(null, i)} className="likes">

现在我想在练习中添加一个减少功能来管理减少状态喜欢，这是问题的出处。

查看代码。

动作

export function decrease(index) {
  return {
    type: 'DECREASE_LIKES',
    index: i
  };
}

Reducer =>添加了[[DECREASE_LIKES案例

function rooms(state = [], action) {
  switch (action.type) {
    case 'INCREMENT_LIKES' :
      const i = action.index;
      return [
        ...state.slice(0, i),
        {...state[i], likes: state[i].likes + 1 },
        ...state.slice(i + 1)
      ];
    case 'DECREASE_LIKES' :
      return [
        ...state.slice(0, i),
        {...state[i], likes: state[i].likes - 1 },
        ...state.slice(i + 1)
      ];
    default:
      return state;
  }
}

Component

<button onClick={this.props.decrease.bind(null, i)} className="likes">

虽然我正在调试，但在
状态

未定义的情况下，它看起来像是在[[DECREASE中。我在做什么错？我该如何解决？

Answer 1