react路由

快速开始

首先安装create-react-app

npm i react-router-dom -S

 在app.js中引入

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

下面是app.js里的内容。

import React from 'react';

import './App.css';

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

// import Heads from './head/heads.js'

// import Conts from './cont/conts.js'

// import Foots from './footer/foots.js'

function Index() {

    return <h2>Home</h2>;

}

 

function About() {

    return <h2>About</h2>;

}

 

function Users() {

    return <h2>Users</h2>;

}

class App extends React.Component {

    render(){

        return (

            <Router>

            <div>

             <nav>

                <ul>

                 <li>

                    <Link to="/">Home</Link>

                 </li>

                 <li>

                    <Link to="/about/">About</Link>

                 </li>

                 <li>

                    <Link to="/users/">Users</Link>

                 </li>

                </ul>

             </nav>

    

             <Route path="/" exact component={Index} />

             <Route path="/about/" component={About} />

             <Route path="/users/" component={Users} />

            </div>

         </Router>

        );

        

    }

}

export default App;

就会实现一个简单的路由。



具体文档看
https://reacttraining.com/react-router/web/example/custom-link