javascript - 如何在 React 中显示默认 View ？

Question

我有一个包含三个不同路由的 React 站点，我希望它自动显示第一个，称为 Home ，当用户进入网站时。这是我在 App.js 中的代码:

<Router>
  <Navigation />
  <Switch>
    <Route path="/hypstats" exact component={() => <Home />} />
    <Route path="/hypstats/auctions" exact component={() => <AuctionViewer />} />
    <Route path="/hypstats/bazaar" exact component={() => <BazaarViewer />} />
  </Switch>
</Router>

这是 Navigation零件:

import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import "../App.css"

function Navigation(props) {
    return (
        <div className="navbar">
            <Link className="navlink" to="/hypstats">HypStats</Link> 
            <Link className="navlink" to="/hypstats/auctions">Auctions</Link>
            <Link className="navlink" to="/hypstats/bazaar">Bazaar</Link>
        </div>
    )
}

export default Navigation;

Answer 1

要将任何 View 设为默认 View ，您可以在导航中包含以下内容

<Route path="/" exact component={() => <Home />} />

或者你可以这样写:

<Redirect from="/" to="/hypstats"}  />


<Router>
    <Navigation />
        <Switch>
            <Route path="/hypstats" exact component={() => <Home />} />
            <Route path="/hypstats/auctions" exact component={() => <AuctionViewer />} />
            <Route path="/hypstats/bazaar" exact component={() => <BazaarViewer />} />
            **<Route path="/" exact component={() => <Home />} />**
        </Switch>
</Router>