React - 路由 Redirect 的使用（路由重定向）

一. Redirect重定向 理解

1. Redirect 一般写在所有路由注册的最下方。
2. 当所有路由都无法匹配时，跳转到 Redirect 指定的路由。
3. to 属性指定重定向的路由。

二. Redirect重定向 使用

import React, { Component } from "react";
import { Redirect, Route, Switch } from "react-router-dom";
import Home from "./pages/Home";
import About from "./pages/About";
import MyNavLink from "./components/MyNavLink";
import "./app.css";
export default class App extends Component {
  render() {
    return (
      <div className="row">
        <div className="col-xs-2 col-xs-offset-2">
          <MyNavLink to="/home/b/c">Home</MyNavLink>
          <MyNavLink to="/about">About</MyNavLink>
        </div>
        <div className="col-xs-6">
          <Switch>
            <Route path="/home" component={Home} />
            <Route path="/about" component={About} />
            {/* 重定向 */}
            <Redirect to="/about" />
          </Switch>
        </div>
      </div>
    );
  }
}