反应给了我一个空白页

Question

我正在处理一些反应项目，我试图通过将一些组件移动到另一个文件然后导入它们来组织我的代码，但是当我这样做时它只会给我一个空白页，当我写时（从“./Header”）当我将所有代码仅放入 index.js 时，它开始提供空白页。 这是我的主要索引代码：

import Header from "./Header"
import Footer from "./Footer"
import Maincontent from "./Main"

function Page(){
    return(
        <div>
        <Header />
        <Maincontent/>
        <Footer />
        </div>
    )
}

ReactDOM.render(<Page/>, document.getElementById("root"))

这是我的标题代码

function Header(){
    return(
    <header>
        <nav className="nav">
            <img src="./react-logo.png" className="img" />
            <ul className="nav-items">
                <li> Pricing </li>
                <li> About </li>
                <li> Contact </li>
            </ul>
        </nav>
    </header>
    )
}

Answer 1

您要导出Header 吗？尝试将export default Header 放在Header 组件文件的底部。