Javascript 元素类型无效。。？

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

import App from "./App";
   6 | //import * as serviceWorker from "./serviceWorker";
   7 | 
>  8 | ReactDOM.render(
   9 |   <BrowserRouter>
  10 |     <App />
  11 |   </BrowserRouter>,



My classes are: (index.js)
import React from "react";
import ReactDOM from "react-dom";
import { BrowserRouter } from "react-router-dom";

import App from "./App";
//import * as serviceWorker from "./serviceWorker";

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

//serviceWorker.unregister();

从“/App”导入应用程序；
6 |//作为serviceWorker从“/serviceWorker”导入*；
7 | 
>8 | ReactDOM.render(
9 |   
10 |     

患者


添加患者

);
}
}
导出默认应用程序；

---

我一直试图理解这个错误，但到目前为止没有任何线索，即使在尝试了互联网上的多个建议之后。

编辑：进一步检查后，您似乎只是错误地导出了应用程序组件

更改：

类应用程序扩展了App.js中的组件{

对此：

类应用程序扩展了React.Component{

---

这应该可以解决您的问题。

因为存在导入反应，{Component}…这样可以。其他导入的文件可能有问题。

import React, { Component } from "react";
import { Switch, Route, Link } from "react-router-dom";
import "bootstrap/dist/css/bootstrap.min.css";
import "./App.css";

import AddPatient from "./components/add-patient.component";
import Patient from "./components/patient.component";
import PatientsList from "./components/patient-list.component";

class App extends Component {
  render() {
    return (

      <div>
        <nav className="navbar navbar-expand navbar-dark bg-dark">
          <a href="/doctor/patients" className="navbar-brand">
            ReactApp
          </a>
          <div className="navbar-nav mr-auto">
            <li className="nav-item">
              <Link to={"/doctor/patients"} className="nav-link">
                Patients
              </Link>
            </li>
            <li className="nav-item">
              <Link to={"/doctor/newpatient"} className="nav-link">
                Add Patient
              </Link>
            </li>
          </div>
        </nav>

        <div className="container mt-3">
          <Switch>
            <Route exact path={["/", "/doctor/patients"]} component={PatientsList} />
            <Route exact path="/doctor/newpatient" component={AddPatient} />
            <Route path="/doctor/patient/:id" component={Patient} />
          </Switch>
        </div>
      </div>

    );
  }
}

export default App;