Question

我的状态非常嵌套，我正在尝试更新options数组内对象的字段。

const INITIAL_STATE = {
  player1: {
    name: null,
    options: [{
      A: null
      B: {
        isUse: null,
        amount: null,
        extra: {
          X: null,
          Y: null
        }
      }
    }, {
      A: null
      B: {
        isUse: null,
        amount: null
        extra: {
          X: null,
          Y: null
        }
      }
    }]
  },
  player2: {
    name: null,
    options: [{
      A: null
      B: {
        isUse: null,
        amount: null,
        extra: {
          X: null,
          Y: null
        }
      }
    }, {
      A: null
      B: {
        isUse: null,
        amount: null
        extra: {
          X: null,
          Y: null
        }
      }
    }]
  },
}

例如，给定name = "player1 2 B"和value = "cheese"，我可以使用以下命令更新我的选项数组的state.player1.options [2] .b：

const keys = name.split(" ");
const player = keys[0]
const idx = keys[1]
const field = keys[keys.length - 1]

return merge({}, state, {
  [player]: {
    ...[player],
    options: state[player].options.map((option, i) => 
      i === idx ? { ...option, [field]: value } : { ...option } 
    )
  }

我将如何使其更具动态性，以便能够更新字段state.player1.options [1] .B.extra？
如果多余后还有另一个嵌套怎么办？

Answer 1

如果您喜欢使用库，则可以使用map-factory

来简化。

代码将如下所示

const INITIAL_STATE = {
  player1: {
    name: null,
    options: [{
      A: null,
      B: {
        isUse: null,
        amount: null,
        extra: {
          X: null,
          Y: null
        }
      }
    }, {
      A: null,
      B: {
        isUse: null,
        amount: null,
        extra: {
          X: null,
          Y: null
        }
      }
    }]
  },
  player2: {
    name: null,
    options: [{
      A: null,
      B: {
        isUse: null,
        amount: null,
        extra: {
          X: null,
          Y: null
        }
      }
    }, {
      A: null,
      B: {
        isUse: null,
        amount: null,
        extra: {
          X: null,
          Y: null
        }
      }
    }]
  }
};

const mapper = require("map-factory")();

mapper
 .map()
 .set("player1.options[1].B", {"hi": "bye"});

console.log(JSON.stringify(mapper.execute(INITIAL_STATE), null, 2));

使用这种方法，您可以根据需要选择多个级别。

如何更新嵌套对象中的字段？

1 个答案: