反应：元素类型无效答案

【问题标题】：React: Element type is invalid反应：元素类型无效
【发布时间】：2021-07-23 00:56:57
【问题描述】：

训练营学生在这里。我正在做一个有趣的个人项目，但我一直遇到这个错误。我检查了这些文件的导入和导出，一切看起来都正确。还有什么可能导致此错误？

错误：

元素类型无效：应为字符串（对于内置组件）或类/函数（对于复合组件），但得到：未定义。您可能忘记从定义组件的文件中导出组件，或者您可能混淆了默认导入和命名导入。

查看App的渲染方法。

App.js file 
import "./styles.css";
import React from 'react'
import { Main } from './main.js'

export default function App() {
  return (
    <div className="App">
      </Main>
      <h1>Hello CodeSandbox</h1>
      <h2>Start editing to see some magic happen!</h2>
    </div>
  );
}

整个项目here。我的项目目标在 app.js

中有注释

【问题讨论】：

从更改为

标签： javascript reactjs

【解决方案1】：

解决方法是您导入主 import Main from './main.js' 的方式，因为您将其导出为默认值。您没有导出对象

App.js file 
import "./styles.css";
import React from 'react'
import Main from './main.js'

export default function App() {
  return (
    <div className="App">
      <Main/>
      <h1>Hello CodeSandbox</h1>
      <h2>Start editing to see some magic happen!</h2>
    </div>
  );
}

您可能还需要在 Main 类中添加一个渲染方法。

import { Component } from "react";
import SUBJECT from "./subject";
import GENRE from "./genre";

class Main extends Component {
  constructor(props) {
    super(props);
    this.state = {
      subject: SUBJECT,
      genre: GENRE
    };
  }
  render() {
    return null;
  };
}

export default Main;

【讨论】：