Javascript 如何在一个状态下乘以每个数字？

我正在尝试用JS编写代码并做出反应。 在App.js文件中，我设置了一些组件的状态，如下所示：

class App extends Component {
  state = {
    leafs: [
      {
        id: "1",
        percent: "",
        win: false,
      }
    ],
    result: [
      {
        winProbability: "0",
      }
    ]
  };

可以添加许多叶子，并在每个叶子中添加不同的百分比。当点击一个按钮时，我想将百分比乘以每个叶中的百分比（如果为真）。如果一片叶子的百分比是3，另一片叶子的百分比是4，最后一片叶子的百分比是5，我希望答案是60 3*4*5

以下是函数：

  calculate = () => {
    leafs: this.state.leafs.map(leaf => {
      if (leaf.win === true) {
        var sum = 1;
        for (var i = 0; i < leaf.percent.length; i++) {
          sum = sum * +leaf.percent[i];
        }
        console.log(sum);
        this.setState({
          result: this.state.result.map(result => {
            result.winProbability = sum;
            return result;
          })
        });
      }
    });
  };

---

根据上述数字，控制台在一行中显示3，然后是4，然后是5。那么我做错了什么？我非常感谢你的帮助

您需要的是reduce函数，而不是映射。您使用map在数组上迭代，并在每次迭代开始时将sum重置为1。我假设您希望实现以下目标：

calculate = () => {
  this.setState({
    result: Object.assign({}, this.state.result, {
      winProbability: this.state.leafs.reduce(
        (winProb, leaf) => (leaf.win ? winProb * leaf.percent : winProb),
        1
      )
    })
  });
};

---

这是可行的，但可能有更好的方法：

  calculate = () => {
    var sum = [];
    leafs: this.state.leafs.map(leaf => {
      if (leaf.win === true) {
        sum.push(leaf.percent);
      }
    });
    var sumPrint = 1;
    for (var i = 0; i < sum.length; i++) {
      sumPrint = sumPrint * +sum[i];
    }
    this.setState({
      result: this.state.result.map(result => {
        result.winProbability = sumPrint;
        console.log(sumPrint);
        return result;
      })
    });
  };

---

你在做错事。尝试以下操作：计算==>{leafs:this.state.leafs.mapleaf=>{if leaf.win===true{var sum=1；对于var i=0；i{result.winProbability=sum；return result；}}}}；}；我没有工作。@Nick我对它进行了编辑，现在生成了与下一个答案中的计算函数相同的结果。