在ReactJs中的href重定向之后加载页面中的组件

npm install react-router-dom

import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import { Redirect } from 'react-router';

// 导入需要加载的组件
import Home from './components/Home';
import About from './components/About';
import NotFound from './components/NotFound';

// 其他组件的导入...

class App extends React.Component {
  render() {
    return (
      <Router>
        <Switch>
          <Route path="/home" component={Home} />
          <Route path="/about" component={About} />
          <Redirect exact from="/" to="/home" /> {/* 重定向到 /home 路由 */}
          <Route component={NotFound} /> {/* 当匹配不到任何路由时显示 NotFound 组件 */}
        </Switch>
      </Router>
    );
  }
}

export default App;