React js - prevstate 不记得以前的状态？

Question

我正在尝试访问和更新嵌套元素内的数组内的变量（状态）；见下文。

interface IState {
  fields: {
    values: ['val1', 'val2'],
}}

我正在使用以下函数来更新数组中的元素：

  onStateSubArrValueChange = (
    newValue: string | Date | boolean,
    fieldName: string,
    index:number,
  ) => {
    this.setState(prevState =>{
      return{
        ...prevState,
        fields: {
          ...prevState.fields,
          [fieldName]:{
            [index]:newValue
          }
        }
      }
    });
  };

我在几个元素上使用了这个，当我改变它们时，最后一个值在状态变量中可见，这是最后更新的。如果我将数组写入文件，我可以看到最后一次更新，但看不到任何其他以前的更新。语法似乎是正确的，TypeScript 没有发出任何警报……该值确实写在元素中 (IState.fields.values[I])。我试图查看 Whosebug 和其他网站，但我似乎无法找到这不起作用的原因。我还尝试了不同的形式和位置来加载 ...prevState。我也使用了状态的正常传播，但显然这并没有保持以前的状态。

 this.setState({
   fields: {
     ...this.state.fields,
     [fieldName]:{
       [index]:newValue
     }
   }
 });

提前感谢您的帮助。

Answer 1

我觉得应该是这样的

this.setState(prevState =>{
  return{
    ...prevState,
    fields: {
      ...prevState.fields,
      values: [...prevState.fields.values, newValue]
    }
  }
});

或下面这个，因为我不太清楚这个问题

this.setState(prevState =>{
  const tempValues = prevState.fields.values;
  tempValues[indexToUpdate] = value
  return{
    ...prevState,
    fields: {
      ...prevState.fields,
      values: tempValues
    }
  }
});

React js - prevstate 不记得以前的状态？

react js - prevstate does not remember the previous state?

javascript

setstate

reactjs