reactjs - 添加新组件后，React 应用程序未加载

Question

我在 React 的一个单独文件中创建了一个 header.js 组件，并将它添加到我的 App.js 文件中，但它没有加载到前端。我没有收到任何错误。在浏览器中显示一个空白页面，在添加标题之前，应用程序正在完美查看。

header.js

import React from 'react';


function Header()
{
     return(
        <Header style={headerStyle}>
            <h1> Todo List </h1>
                 </Header>

     )
}

const headerStyle = {
    background: '#333',
    color: '#fff',
    textAlign: 'center',
    padding : '10px'
}


export default Header;


app.js

 render(){
    //console.log(this.state.todos)
  return (
    <div className="App">
       <Header />
      <Todos todos ={this.state.todos} markComplete ={this.markComplete} delTodo={this.delTodo} />
    </div>
  );
  }
}

我在 app.js 文件中导入头文件

在终端上显示：注意，开发版本未优化。要创建生产版本，请使用 npm run build。浏览器显示空白页面

标签： reactjs