尝试导入错误：“./components/headerComponent/header”不包含默认导出（导入为“标题”）

Question

我正在尝试将 header 从一个文件导入到另一个文件，但它不起作用。

import React from 'react';
import { Typography, Card, CardContent } from '@material-ui/core';
import Header from './components/headerComponent/header';


export default function Home() {
    return (
        <div className="Page">

            <Header />

            <div  className="this">
                <h2>Welcome Back!</h2>
            </div>

        </div>
    );
}

这是我正在尝试导入的 header 的代码

import React, { Component } from 'react';
class Header extends Component {
  render() {
    return (
      <header>
        Dashboard
      </header>
    );
  }
}

export default Header;

我不断收到此错误：

Attempted import error: './components/headerComponent/header' does not contain a default export (imported as 'Header').

Answer 1

我在这里做了一个尝试。

https://codesandbox.io/s/fancy-butterfly-r33ur?file=/src/components/headerComponent/header.js

快乐编码：:)

Answer 2

考虑到将导入语句更改为此

import Header from './components/headerComponent/header.component';