Question

这是完整的错误

警告：React.createElement：type不应为null或未定义。它应该是一个字符串（对于DOM元素）或一个ReactClass（对于复合组件）。

这就是我在这个视图中的全部内容

import React, { Component } from 'react';
import Router, {Link, RouteHandler} from 'react-router';
import { Grid, Row, Column, List, ListItem } from '../../components/Layout';
import { RaisedButton, Paper } from 'material-ui';

const videosInformation = {
  time      : 25,
  gameId    : 15665,
  date      : '12 10 2015',
  gameName  : "Black Jack"
};

export default class Home extends Component {

  static contextTypes = {
    router  : React.PropTypes.func
  }  

  render () {
    return <Grid>                   
      <Row>
        <Column>
          <Paper>
            <List subheader="Player Info">
              <ListItem primaryText={`Name: ${videosInformation.time}`} />
              <ListItem primaryText={`Nickname: ${videosInformation.date}`} />
              <ListItem primaryText={`Age: ${videosInformation.gameId}`} />
              <ListItem primaryText={`Language: ${videosInformation.gameName}`} />
            </List>
          </Paper>
        </Column>  
        <Column>
          <iframe width="560" height="315" src="https://www.youtube.com/embed/Ta4xuThmAsQ" frameBorder="0" allowFullScreen></iframe>
        </Column>
      </Row>
    </Grid>;
  };

}

我正在使用Material-UI

Answer 1

您的Layout文件可能没有从此行导出其中一个变量

import { Grid, Row, Column, List, ListItem } from '../../components/Layout';

如果其中一个未定义，则会发出警告。

Answer 2

我知道这里找到了正确的解决方案，但我只想分享另一个可能触发ReactJS React.createElement: type should not be null or undefined警告的原因。

当您的模块中存在循环依赖时，也会发生这种情况。然后，执行导入模块的console.log()将返回一个空对象。

有关更多详细信息，请查看此其他stackoverflow线程：Require returns an empty object

Answer 3

万一有人遇到这个问题并且上面的解决方案没有帮助，我所要做的就是将我的顶级ReactDOM.render（）函数移到JavaScript的其余部分下面，以确保所有变量在之前被初始化被召唤。我正在https://reactjs.net/getting-started/tutorial_aspnet4.html

上学习本教程

Reactjs：警告：React.createElement：type不应为null或未定义

3 个答案: