Object.assign - 更新特定属性

Question

在这里使用 React 和 Redux：

我的 State 看起来与此类似：

State : {
   First : {
      prop1 : "a",
      prop2 : "b"
   },
   ...
   Last : {
      prop1 : "c",
      prop2 : "d"
   }
}

我的 Reducer 函数如下所示：

const tabsState = ( state = initialTabState, action ) => {
    switch( action.type ) {
    case( ENABLE_TAB ):
        return (
            Object.assign( {}, state, action.payload )
        );
    default:
        return state;
    }
};

对于 action.payload，我只想发送包含 prop1 新值的数据。我对 Object.assign 的理解是 sources 参数只更新 props，它们不会覆盖状态中的对象，对吗？

在上面，我的action.payload是类似这样的：

   First : {
      prop1 : "z"
   },
   Second : {
      prop2 : "x"
   },
   ...

它似乎覆盖了 State 对象中的 First 及后续对象。也就是说，Reducer 返回的新 State 没有每个对象的 2nd prop。 prop2s

Answer 1

你需要使用深度赋值来像这样合并对象树。

https://github.com/sindresorhus/deep-assign

Answer 2

我认为你可以使用 Immutable.js。我发现它对处理 redux 和不改变状态树非常有帮助。对于您的特定情况，您需要 Map.mergeDeep() 运算符，其中 Map 是您的不可变数据结构。 MergeDeep 会像您想象的那样行事 Object.assign 会。所以对于你来说

import { fromJS } from 'immutable';
const initialTabState = fromJS({
     {
       First : {
         prop1 : "a",
         prop2 : "b"
       },
     ...
       Last : {
         prop1 : "c",
         prop2 : "d"
       }
     }
})
const tabsState = ( state = initialTabState, action ) => {
    switch( action.type ) {
    case( ENABLE_TAB ):
        return (
            state.mergeDeep(fromJS(action.payload))
        );
    default:
        return state;
    }
};

Answer 3

假设您的状态如下所示：

{
  state: {
    meta: {
      data: {
        foo: 'bar',
      },
    },
  },
}

你希望它看起来像这样：

{
  state: {
    meta: {
      data: {
        foo: 'bar',
        hello: 'world',
      },
    },
  },
}

首先，创建一个函数来更新您想要获取的嵌套属性：

const update = (data, obj) => {
  return Object.assign(
    {},
    data,
    obj,
  )
}

然后，像这样调用 update 函数：

return Object.assign(
  {},
  state,
  {
    meta: {
      data: update(state.meta.data, {hello: 'world'}),
    },
  },
)

Object.assign - 更新特定属性

Object.assign - Update Specific Property

javascript

object

reactjs

redux

Object.assign - 更新特定 属性

Object.assign - Update Specific Property

javascript

object

reactjs

redux

Object.assign - 更新特定属性