# React Router

## 指令

npm install react-router-dom@5 //路由

## 操作

### Switch 畫面切換

import './[class/scss].scss';
import Note from './Note';
import News from './News';
import {BrowserRouter as Router,Route,Switch} from 'react-router-dom';

function App() {
    return (
        <Router>
            <div className="header">
                <Navbar />
            </div>
            <div className="content">
                <Switch>
                    <Route exact path="/">
                        <Note />
                    </Route>
                    <Route path="/news">
                        <News />
                    </Route>
                </Switch>
            </div>
        </Router>
    );
}

export default App;

### Link 連結

import{ Link } from 'react-router-dom'

const Navbar = () => {
    return ( 
        <nav className="c-nav">
            <Link to="/">nots</Link>
            <Link to="/news">news</Link>
        </nav>
    );
}

export default Navbar;

## Parameters參數

###### tags: `react` `react-router`

## 其他相關

[React](/ghefbDKDShOwnlZka4YhZA)