React中如何重置状态对象，避免新状态叠加旧状态？

你的问题出在直接修改状态对象并基于旧状态累加计算，导致每次调用都会在原有数据上叠加。要实现每次重新计算时从空状态开始，只需在统计时创建全新的对象，而非复用旧状态：

function calcGroupofSponsors(data: any) {
  // 每次计算都创建一个全新的空对象，不依赖旧状态
  const newGroup: { [key: string]: number } = {};
  
  data?.forEach(function (value: ISponsorDetails) {
    // 基于新对象统计数量，从零开始计数
    if (newGroup[value.status]) {
      newGroup[value.status] += 1;
    } else {
      newGroup[value.status] = 1;
    }
  });
  
  // 直接设置新状态，完全替换旧状态
  setGroupOfSponsors(newGroup);
} 

关键说明： #

• 不再直接操作groupOfSponsors状态对象，避免了React状态的突变（React状态应保持不可变性）。
• 每次调用函数都初始化空的newGroup，确保统计完全基于当前传入的data重新计算，不会累积旧数据。
• 最终通过setGroupOfSponsors将新对象设置为状态，完全覆盖旧状态，达成你预期的效果。

内容的提问来源于stack exchange，提问作者Juicy Jay