Javascript 在React中，如何在循环中设置状态变量？

我有许多状态变量（我只显示了3个）：

给予

现在有什么方法可以循环使用这些检索到的值并设置状态，例如循环或映射版本：

this.setState({dat['field_name']:dat['start_text']});

因此，返回的第一行是fieldname=i1，start_text='hi'，因此循环将

setState（{i1:'hi'}）

反应文档： setState（）不会立即改变this.state，但会创建挂起的状态转换。调用此方法后访问this.state可能会返回现有值。无法保证对setState调用的同步操作，调用可能会>批处理以提高性能

不要在循环中调用setState， 只需在aloop中更新一个局部变量，然后对该变量调用setState方法，这将为您节省一些重新加载程序

反应文档： setState（）不会立即改变this.state，但会创建挂起的状态转换。调用此方法后访问this.state可能会返回现有值。无法保证对setState调用的同步操作，调用可能会>批处理以提高性能

不要在循环中调用setState，

---

只需在aloop中更新一个局部变量，然后对该变量调用setState方法，这将为您节省一些重新加载的时间，作为一个技术问题“我可以这样做吗？”答案是“可以”。在您的示例中，可以在循环内调用

setState

，因为每个状态更新都是相互独立的，并且不依赖于状态的先前值。React可能会将

setState

更新批处理在一起，这样您就不会有多个重新渲染

for (var key in response.data) {
  var dat = response.data[key];
  this.setState({ [dat.field_name]: dat.start_text });
}

在

[dat.field\u name]

周围使用括号，因为它是一个变量属性键。但是变量属性名对于Typescript来说是个问题，因为它假定它们是

string

，而不是有效的键

---

我可能会按照@Sharon Geller的建议，使用组合值调用一次

setState

const changes = response.data.reduce(
  (acc, curr) => ({ ...acc, [curr.field_name]: curr.start_text }),
  {}
);
this.setState(changes);

---

从技术上讲，这不需要断言，因为

的类型changes

是空对象

{}

，但是您可能希望在初始值

{}上断言一个类型作为State

作为“我可以这样做吗？”的技术问题，答案是“是”。在您的示例中，可以在循环内调用

setState

，因为每个状态更新都是相互独立的，并且不依赖于状态的先前值。React可能会将

setState

更新批处理在一起，这样您就不会有多个重新渲染

for (var key in response.data) {
  var dat = response.data[key];
  this.setState({ [dat.field_name]: dat.start_text });
}

在

[dat.field\u name]

周围使用括号，因为它是一个变量属性键。但是变量属性名对于Typescript来说是个问题，因为它假定它们是

string

，而不是有效的键

---

我可能会按照@Sharon Geller的建议，使用组合值调用一次

setState

const changes = response.data.reduce(
  (acc, curr) => ({ ...acc, [curr.field_name]: curr.start_text }),
  {}
);
this.setState(changes);

---

从技术上讲，这不需要断言，因为

的类型changes

是空对象

{}

，但是您可能希望在初始值

{}上断言一个类型作为State

谢谢，非常有帮助。但是我得到的

参数'prev'隐式地有一个'any'类型。

知道为什么吗？什么是

prev

？哦，对不起，我更改了

acc

的名称。它应该得到初始值的类型，即

{}

。如果需要不同的类型，可以将初始值的类型断言为State{}。这可能会有帮助吗？我对这一切都不熟悉，所以我会读更多。非常感谢你！谢谢，非常有帮助。但是我得到的

参数'prev'隐式地有一个'any'类型。

知道为什么吗？什么是

prev

？哦，对不起，我更改了

acc

的名称。它应该得到初始值的类型，即

{}

。如果需要不同的类型，可以将初始值的类型断言为State{}。这可能会有帮助吗？我对这一切都不熟悉，所以我会读更多。非常感谢你！

const changes = response.data.reduce(
  (acc, curr) => ({ ...acc, [curr.field_name]: curr.start_text }),
  {}
);
this.setState(changes);