reactjs - 反应导航栏组件导致渲染失败

Question

我正在启动一个反应项目，我正在尝试添加一个简单的导航栏。

我的 App.js 看起来像这样

import React, { Component, Navbar } from "react";
import TheNav from "./Components/Nav.js";
import "./App.css";

class App extends Component {
  render() {
    return <Navbar />;
  }
}

export default App;

我的 index.js 看起来像这样：

import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import App from "./App";
import registerServiceWorker from "./registerServiceWorker";

ReactDOM.render(<App />, document.getElementById("root"));
registerServiceWorker();

当我运行它时，浏览器会对我大喊：

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

检查App.

有什么建议么？

标签： reactjs

Answer 1

React 不会导出Navbar组件。改用你自己的TheNav。

import React, { Component } from "react";
import TheNav from "./Components/Nav.js";
import "./App.css";

class App extends Component {
  render() {
    return <TheNav />;
  }
}

export default App;