无法在 React 中添加组件

Question

我正在尝试在我的 react App.js 中添加 footer.js

这是我的 app.js。

import React, { Component } from "react";
import "./App.css";

import Navbar from "./Navbar";
class App extends Component {
  render() {
    return (
      <div className="App">
        <BrowserRouter>
          <div>
            <Navbar />    
            <Switch>
              <Route path="/" exact component={Home} />
              <Route path="/SignIn" component={SignIn} />
            </Switch>
            <navfooter />
          </div>
        </BrowserRouter>
      </div>
    );
  }
}

export default App;

在我的 App.js 文件中，我使用了 NavBar，它运行良好。我使用相同的概念在 App.js 文件中添加 footer.js 文件。我也可以尝试使用预先构建的页脚文件，但我想要自己的页脚文件。 这是我的footer.js

import React from "react";

const navfooter = (props) => {
  return (
    <div>
      <p>footer</p>
    </div>        
  );
};

export default navfooter;

它显示如下：

我的代码编辑器 VS Code 没有显示任何错误或警告。 但是控制台显示错误：

那么我做错了什么？

Answer 1

对不起，我刚刚意识到我的错误，我应该写 Navfooter 而不是 navfooter