【问题标题】:Trying to find the sum of checked values in a table using react尝试使用反应在表中查找检查值的总和
【发布时间】:2020-08-08 17:26:26
【问题描述】:

此函数当前返回总分,但我试图仅获取检查值(分数)的总和。因此,每次用户选择复选框时,该函数都会返回分数的总和。

“分数”是表格中的三列之一。我正在使用复选框进行选择。

calculateTotal=(e)=> {
    const { input, checked, type} = e.target;
    let sumVal= 0;

    this.props.items.forEach((item, i)=> {
      if(checked === true){
        ( sumVal += item.score)
      }
    })

   this.setState(sumVal => sumVal)

    console.log(sumVal);
    document.getElementById("val").innerHTML = "Sum Value =" + sumVal;
  }

【问题讨论】:

  • 你好。您能否提供更具体的 Minimal, Complete, and Reproducible 代码示例,并包含有关未按预期工作的具体细节。 this.props.items 是什么,是复选框吗?如果事件的checked 为真,则此实现的总和为items 的长度,如果为假,则为0。
  • this.props.items 是保存分数和其他信息(fname、lname)的数据。是的,这实现了项目长度的总和。因此,如果用户选中 2 个复选框,它将返回所有分数的总和,而不仅仅是这 2 个选中分数的总和。
  • 这就是我所说的,根据e.target.checked 的值,该函数要么将所有item.score 相加,要么没有。请包括所有相关代码。您指的复选框是什么/在哪里?复选框和items 有什么关系?

标签: reactjs jsx


【解决方案1】:

当你在 this.setState 中给出函数时,函数获取之前的状态作为参数。您基本上返回了相同的状态,因此没有任何改变。

calculateTotal=(e)=> {
    const { input, checked, type} = e.target;
    let sumVal= 0;

    this.props.items.forEach((item, i)=> {
      if(checked) sumVal += item.score
    })

   this.setState(prevState=>({...prevState, sumVal}));
   // this.setState({sumVal}) ; // also works

    console.log(sumVal);
    document.getElementById("val").innerHTML = "Sum Value =" + sumVal;
  }

如果我遗漏了什么,请告诉我。

【讨论】:

  • 请立即尝试,缺少一个 ')'。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-07-27
  • 2018-09-21
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多