ReactJS - 超级表达式必须为null或函数，而不是未定义。

13 浏览
0 Comments

ReactJS - 超级表达式必须为null或函数，而不是未定义。

我一直在跟随udemy上的一门课程，但无论我做什么都会出现一个错误：

enter image description here

这是组件的代码：

import React from 'react';
import { Component } from 'react';
import { connect } from 'react-redux';
import Chart from '../components/chart';
class WeatherList extends Component {
  constructor(props) {
    super(props);
  }
  renderWeather(cityData) {
    ...
  }
  render() {
    return (
      ...
    );
  }
}
function mapStateToProps(state) {
  return {
    weather: state.weather
  };
}
export default connect(mapStateToProps)(WeatherList);

这是我导入的Chart组件：

import React from 'react';
import { Sparklines, SparklinesLine, SparklinesReferenceLine } from 'react-sparklines';
import _ from 'lodash';
function average(data) {
  return _.round(_.sum(data) / data.length);
}
const Chart = (props) => {
  return (
      
        
        
      
        { average(props.data) } { props.units }
  );
};
export default Chart;

但显然React.Component未定义，所以会抛出一个错误。

0

2 答案

0 Comments

在进一步检查后，发现问题出在Chart组件中，因为在组件中尝试访问一个未定义的thisprops对象。

所以，代替data={thisprops.data}应该是：data={props.data}。

我的React版本是14.9，在添加Chart组件之前一切都运行正常，至于代码，不重要，因为当我注释掉import Chart from 'url'时，它不会抛出错误。所以我只展示了导致应用程序出错的部分。

我编辑了我的答案。尝试将您的Chart组件用具有命名default导出的方式导出，而不仅仅是导出一个函数。另外，为什么不将整个Chart组件代码发布出来，因为它是导致问题的原因？

我刚刚在问题中添加了文件的其余部分。

这个data={thisprops.data}怎么样？它应该是data={props.data}，显然是这样的。我已经更新了我的答案，作为解决这个问题的解决方案。

这只是因为我尝试将其转换为基于类的组件，然后它什么也没做，所以这是一个无关的问题。我仍然遇到同样的问题。谢谢你的尝试，但我认为这个问题没有解决办法。我很快就要关闭它了。

0
0 Comments

ReactJS - Super expression must either be null or a function, not undefined 这个问题的原因是由于 'react-sparklines' 版本过高导致的。解决方法是通过降级 'react-sparklines' 的版本。

具体的解决步骤如下：

1. 打开终端或命令行工具，进入项目所在的目录。

2. 输入以下命令，将 'react-sparklines' 的版本降级为 0.6.0：

npm i --save react-sparklines@0.6.0

3. 等待安装完成。

通过上述步骤，我们成功解决了 "ReactJS - Super expression must either be null or a function, not undefined" 这个问题。

0