arrays - 如何在 react 中的对象数组内设置对象数组的状态

Question

我正在尝试在另一个对象数组中的对象数组中设置一个状态。我尝试了很多东西，但找不到好的解决方案。

这是我的数组:

this.state = {
  Pages: [
    {
      image: undefined,
      audio: undefined,
      audioName: undefined,
      subtitles: 'up',
      Langs: [
        {
          lang: 'fr_FR',
          text: '',
        }
      ]
    }
  ]
};

我想修改 this.state.Pages[i].Langs[y].lang 或 .text 值。有人有想法吗？

Answer 1

您可以创建 Pages 和 Pages[i].Langs 数组的副本，并创建 Pages[i].Langs[ y] 对象并覆盖 lang 或 text 属性。

示例

changeText = (i, y, text) => {
  this.setState(previousState => {
    const Pages = [...previousState.Pages];
    const Langs = [...Pages[i].Langs];

    Langs[y] = { ...Langs[y], text };
    Pages[i] = { ...Pages[i], Langs };

    return { Pages };
  });
};