反应：组件的孩子不应该被改变答案

【问题标题】：React: Component's children should not be mutated反应：组件的孩子不应该被改变
【发布时间】：2016-10-21 12:55:34
【问题描述】：

我在 react 项目（还有流星）中遇到了这个我从未见过的奇怪错误，并对其进行了研究，没有发现任何可以帮助我解决它的问题。基本上我得到这个错误：

Component's children should not be mutated. 在组件上的以下 3 个元素上。

<h4>Team's defense: {defense}%</h4>
<h4>Team's offense: {offense}%</h4>
<h4>Team's total: {total}%</h4>

所以基本上我从父级传递了一个players 数组，并使用这个玩家（道具）列表在子组件上执行一系列如下公式。

// PLAYMAKING RISKS
const playmakingRisks = Math.round((players.reduce((playmakingRisks, player) => {
  return playmakingRisks + player.playmakingRisks;
  // calculating below the total potential score of the team
}, 0) / (3 * numPlayers)) * 100);

// TOTALS
const defense = Math.round((duelTackling + fieldCoverage + blocking + gameStrategy + playmakingRisks)/5);
const offense = Math.round((kicking + ballManipulation + passing + fieldCoverage + gameStrategy + playmakingRisks)/6);
const total = Math.round((kicking + ballManipulation + passing + duelTackling + gameStrategy + fieldCoverage + blocking + playmakingRisks)/8);

3 const 已经在状态中用于播放器视图，因此尝试了不同的方法以查看是否可以修复它我更改了这 3 个变量的名称但没有成功。我什至用console.log(typeof playmakingRisks); 检查了我所有的变量，以确保它们是数字。

我没看到什么？

【问题讨论】：

你可以为你的组件发布整个代码吗？
这里是完整的组件：gist.github.com/mannyhenri/9673c94bc7b3907bdf612d3f004c8e5d
@JohnF。往上看。
你用的是什么版本的 react？我记得看到与 NaN 产生的值类似的东西导致了这个问题，正如这张票 github.com/facebook/react/issues/7424 中所解决的那样，但它已经针对版本 15.4.0 进行了修复
好吧，好像是问题所在，等正式版出来我再测试。感谢您的帮助

标签： javascript reactjs meteor

【解决方案1】：

我看到你正在做数学计算，所以看起来你的值之一很可能有时是NaN。确保它不是NaN，你会没事的。

您可以在此处阅读更多内容：https://github.com/facebook/react/issues/7424

【讨论】：