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

维克多·扎多罗日内

我有一个简单的操作来在 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
    }
}

更新现在我知道如何指向 F2F 对象

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

但不知道如何在 F2F 内部传递其余状态。因为现在当我设置一种状态时,里面只有一种状态 谁能帮助我?

凯尔·理查森

尝试使用下面的块来解决您的嵌套状态问题。

如果您正在使用 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()方法用于将所有可枚举自身属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。

所以在这个例子中:Object.assign({}, state[action.dimensions], { ... })我们正在获取一个空对象{}并将所有可枚举的自己的属性分配给state[action.dimensions]它。然后我们从中获取可枚举自己的属性{ ... }并将它们应用于更新的对象。

合并具有相同属性的对象

这些属性会被其他具有相同属性的对象在参数顺序后面覆盖

...object当您使用 babel transform-object-rest-spread插件时,这就是正在转换的内容

深度克隆警告

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

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章