代码之家  ›  专栏  ›  技术社区  ›  victor zadorozhnyy

如何对多维对象使用Redux操作?

  •  0
  • victor zadorozhnyy  · 技术社区  · 9 年前

    我有一个简单的动作来设置n1维的状态 我的状态对象和减速机如下所示

        const F2F = {
            openF2F: false,
            ...
        }
    
        const initialState = {
            showModal: false,
            F2F,
            ...
        }
    
    export default function reducer(state=initialState, action) {
        switch (action.type) {
    
            case psActions.ON_CHANGE:
                return {
                    ...state,
                    [action.fieldName]: action.value
                }
    
            default:
                return state
      }
    }
    

    我有一个问题,如何使一个动作指向状态对象

    export function onChangeDim(value, name, dimension) {
        return {
            type:      psActions.ON_CHANGE,
            fieldName: dimension[name],//Tried many things her
            value:     value
        }
    }
    

    使现代化

    case psActions.ON_CHANGE_DIM:
        return {
            ...state,
            [action.dimension]: {
                [action.fieldName]:action.value
            }
        }
    

    有人能帮我吗?

    1 回复  |  直到 9 年前
        1
  •  1
  •   Kyle Richardson    9 年前

    如果你用的是babel transform-object-rest-spread ,看起来你就是。

    return {
        ...state,
        [action.dimension]: {
            ...state[action.dimension],
            [action.fieldName]:action.value
        }
    }
    

    Object.assign({}, state[action.dimensions], { ... })

    编辑:发表评论;

    请查看MDN上关于 Object.assign()

    Object.assign()

    所以在这个例子中: 对象赋值({},状态[action.dimensions],{…}) 我们拿的是一个空物体 {} 并分配所有 可枚举 属性来自 state[action.dimensions] 投入其中。然后我们采取 拥有 { ... }

    合并具有相同特性的对象

    这就是 ...object

    对于深度克隆,我们需要使用其他替代方法,因为对象。assign()复制属性值。如果源值是对对象的引用,则仅复制该引用值。