首页 > 解决方案 > 我收到 TypeError 说 forEach 不是函数?

问题描述

我正在尝试使用 chartist.js 显示折线图。我曾经reduce()props. 我在平均值对象中有键year和值。average value但我无法显示折线图,因为我无法在图表上看到任何线条,我收到类型错误。我已经创建了 React 组件,并在里面componentDidMount()添加了我的折线图代码。我认为这个问题与 javascript/reactjs 而不是 chartist.js 有关

代码:

class Linechart extends Component {

  constructor(props){
    super(props);
  }

  componentDidMount(){

        const totals = this.props.bowldata.reduce((a, {season, econ})  => {

          if (!a[season]) {
            a[season] = {sum: 0, count: 0};
          }

          if(econ !== null){
            a[season].count++;
            a[season].sum += parseInt(econ);

          }

          return a; 

      }, {});

        const averages = {};

        Object.keys(totals).forEach(key => {   

          averages[key] = totals[key].sum / totals[key].count;

        });

      console.log(averages);

      const series = Object.values(averages);

      const labels = Object.keys(averages);

        const data = {
            series:series,
            labels:labels
        }

        this.linechart = new Chartist.Line('.ct-line-chart', data, options);
  }

  render(){
    return(
      <div>
          <div className="col-md-3 col-xs-6 ct-line-chart">
              {this.linechart}
          </div>
        </div>
    )}
}

export default Linechart ;

使用.forEach()我正在尝试使用sum/countas avaluekeyas创建新的对象数组year

截屏: 在此处输入图像描述

在此处输入图像描述

标签: javascriptreactjs

解决方案


像这样更改您的代码,看看问题是否消失了。在文档中,它显示series应该是一个多维数组。

 const data = {
     series:[series],
     labels:labels
 }

推荐阅读