Javascript 响应路由器路由到类组件

我试图路由到一个类组件，但它给了我一个错误。当我将组件更改为功能组件时，路由工作正常。如何路由到类组件

我不熟悉使用react路由器。我首先要路由到一个功能组件。但是一旦我意识到组件需要是一个类，我就把它改成了一个类，现在路由显示出来了

无法获取/浏览/单词'

index.js

import React from "react";
import { render } from "react-dom";
import { BrowserRouter } from "react-router-dom";
import App from "./App";

render(
  <BrowserRouter>
    <App />
  </BrowserRouter>,
  document.querySelector("#root")
);

App.js

import React from "react";
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";

import HomePage from "./pages/HomePage";
import ExplorePage from "./pages/ExplorePage";

function App() {
  return (
    <Router>
    <div>
      <header>
        <nav>Course Finder</nav>
      </header>
        <Route path="/" component={HomePage} />
        <Route path="/explore/:campus" component={ExplorePage} />
    </div>
    </Router>
  );
}

export default App;

Explore.js

import React, { Component } from "react";

class ExplorePage extends Component {
  render() {
    return (
      <div>
        <h1>Explore</h1>
      </div>
    );
  }
}

export default ExplorePage;

预期结果是看到“探索”标题。

---

我得到的是“无法获取/浏览/words”。

这很好，您只需将/explore/one添加到url即可查看路由是否正常工作

---

需要明确的是，对于react路由器dom，react组件不需要是类。另外请记住，有一个名为exact的路线道具，通常与默认/主路线一起使用。将您的主页也张贴在您有链接/导航的位置。如果您使用的是webpack@isuruAb谢谢，这是我的实际问题。我在这里读到并了解到：@AlexanderStaroselsky谢谢！我想是的，我在挠头，为什么会有一个组件限制。我的问题是网页缺少配置说明！谢谢你，是的，我所做的没有错。