React

1.路由

 

 

content = 
　　<Switch>
        <Route path="/login" exact component={LoginPage} />
        <Route render={() => { return <Redirect to="/login" />; }} />
     </Switch>

// 如果loggedIn 为 false, 则重定向跳转到 /home 页面

import { Route, Redirect } from 'react-router'

<Route exact path="/" render={() => (
  return loggedIn ? (
    <Redirect to="/home"/>
  ) : (
    <User />
  )
)}/>

<Redirect
  to={{
    pathname: "/login",
    search: "?utm=your+face",
    state: { referrer: currentLocation }
  }}
/>

import React , { Component } from 'react';
import { BrowserRouter as Router, Route, NavLink, Switch, Redirect } from 'react-router-dom';
import Home from '../Home/Home';
import About from '../About/About';
import News from '../News/News';

class App extends Component {
  render() {
    return (
      <Router>
        <div>
          <li><NavLink to="/">Home</NavLink></li>
          <li><NavLink to="/about">About</NavLink></li>
          <li><NavLink to="/news">News</NavLink> </li>   <br/>

          <Switch>
            <Route path="/" exact component={Home} />
            <Route path="/about" component={About} />
            <Route path="/news" component={News} />
            <Redirect from="/*" to="/" />
          </Switch>
          
        </div>
      </Router>
    );
  }
}

export default App;