在另一个组件中导入的组件未显示 - Reactjs

Question

您刚刚开始学习React的基础知识，并且在另一个组件中渲染我的组件时遇到了问题。

{/ 1}}在index.js中导入的组件未显示。

Index.js：

<Header>

我有这个错误： import React, {Component} from 'react'; import { render } from 'react-dom'; import Header from './components/Header'; import Home from './components/Home'; class App extends Component{ render(){ return( <div className="container"> <div className="row"> <div className="col-xs-10 col-xs-offset-1"> <div className="col-xs-10 col-xs-offset-1"> <Header /> </div> </div> </div> <div className="row"> <div className="col-xs-10 col-xs-offset-1"> </div> </div> </div> ); } } render(<App />, window.document.getElementById('container'));

Header.js 组件也是：

Error: Minified React error #130; visit http://reactjs.org/docs/error-decoder.html?invariant=130&args[]=undefined&args[]= for the full message or use the non-minified dev environment for full errors and additional helpful warnings.

Answer 1

当您打开网址时，它会显示：

  

元素类型无效：需要一个字符串（用于内置组件）   或类/函数（对于复合组件）但得到：undefined。

这意味着：

• 您忘记在文件中导入Header
• 你导入的方式不正确，
• Header未导出到文件
中
• 以上所有

修改后：

你需要修改导出（就像我上面写的那样）：

export default class Header extends React.Component {

你错过了default。