javascript - 更新嵌套 Redux reducer 对象的值

Question

我有一个关于 Redux 和更新嵌套对象值的问题。

假设这是我的初始状态:

const INITIAL_STATE = {
 columnState: {
  1: {
    loading: false
  },
  2: {
    loading: false
  }
 }
};

当我的 reducer 被调用时:

case COLUMN_STATE_UPDATE:
    const { type } = payload;
    return {
       ...state
    }
}

如何更新特定 ID 的 loading 值？假设我使用 key = 2 更新条目，如何将 key 2 的 columnState 对象的 loading 值更改为 true 并返回新状态？

Answer 1

如果您的COLUMN_STATE_UPDATE操作仅更新 columnState部分(假设你的 type 中的 payload 作为键):

case COLUMN_STATE_UPDATE:
    const { type } = payload;
    return {
       ...state,                     // keep the other keys as they were
       [type]: {                     // only update the particular one
           loading: true 
       }
    }
}

<小时/>

如果您的COLUMN_STATE_UPDATE操作正在更新整个状态，如下所示 INITIAL_STATE (再次假设 type 在你的 payload 中作为键):

case COLUMN_STATE_UPDATE:
    const { type } = payload;
    return {
       ...state,                     // keep the other keys of state as they were
       columnState: {
           ...state.columnState,     // keep the other keys of columnState as they were
           [type]: {                 // only update the particular one
               loading: true
           }
       }

    }
}