React setstate nested object issue

问题描述 投票:0回答:1

我无法在第二天晚上解决这个setState,我已经绝望了。我有大量嵌套的对象,我正在尝试更新。如果我在todaysMenu中有多个元素,并且我试图更新第二个元素的状态,则整个数组将被“存储”在TodaysMenu的第一个元素中。

onChangeAnyValue(values, itemIndex) {
        const key = Object.keys(values.x)[0];
        const provideDate = values.date;
        this.setState(prevState => ({
            data: prevState.data.map(day => day.date === provideDate ? {
                ...day,
                todaysMenu: [{
                    ...day.todaysMenu,
                    [itemIndex]: {
                        ...day.todaysMenu[itemIndex],
                        dish: {
                            ...day.todaysMenu[itemIndex].dish,
                            [key]: values.x[key]
                        }
                    }
                }]
            } : day)
        }));
    }

如果我除去方括号,则将其存储为对象。

Before

After

谢谢您的时间!

javascript arrays object nested setstate
1个回答
0
投票

您将要更改:

todaysMenu: [{
  ...day.todaysMenu,
  [itemIndex]: {
    ...day.todaysMenu[itemIndex],
    dish: {
      ...day.todaysMenu[itemIndex].dish,
      [key]: values.x[key]
    }
  }
}]

...到:

todaysMenu: day.todaysMenu.map((item, index) => index === itemIndex
  ? {
    ...item,
    dish: {
      ...item.dish,
      [key]: values.x[key]
    }
  } : item
)

当前,您正在使用一个对象创建一个数组,而不是将一个数组转换为修改后的数组。

© www.soinside.com 2019 - 2024. All rights reserved.