如何在树下进一步更新redux状态

Question

对于给定的reducer,我的redux状态树通常看起来像这样:

{
  someField: 'some value',
  // ... more fields
  metadata: {
    pending: false,
    fetched: true,
  }
}

通常,当我执行异步请求时,我会触发一个SOME_ACTION_REQUEST动作,该动作将metadata.pending属性设置为true.当匹配SOME_ACTION_RESPONSE或SOME_ACTION_ERROR事件稍后涓涓细流时,它会再次重置为false .

但是,我更新状态的方式有点冗长:

case actions.SOME_ACTION_REQUEST: {
  return {
    ...state,
    metadata: { ...state.metadata, pending: true },
  };
}

有更简单的方法吗？

Object.assign({}, state, { metadata: { pending: true } }) 也不是很易读.

Answer 1

您可以选择减速器的嵌套结构。

如果有一个函数/减速器命名元数据，请调用它来更改字段。

示例代码

const metadata = (state = [], action = {}) => {
    switch (action.type) {
        case actions.SOME_ACTION_REQUEST::
            return {...state, ...action.payload.metadata};

        default:
            return state;
    }
};
const someReducer = (state = initalState, action = {}) => {
    let metadata = {};
    switch (action.type) {
        case actions.SOME_ACTION_REQUEST: {
            metadata = metadata(state.metadata, action)
            return {
                ...state,
                ...metadata
                };
            }
    }
};