react路由

首先使用npm安装模块

npm i react-router-dom

哪里需要就在哪里引用
ex>

import React from 'react';
import { HashRouter as Router, Route, Switch } from 'react-router-dom';

function App() { 
  return (
    <div className="App">
      <Router>
        {/* exact表示绝对匹配 */}
        {/* 在react-router中每一个Route相当于一个组件 */}
        {/* 在传递参数的时候可以设置成 :参数名? 表示可选参数 */}
        {/* Switch表示只匹配一个符合条件的路由 */}
        <Switch>
          <Route path="/" exact component={()=><h1>首页</h1>} />
          <Route path="/hot/:tag" component={()=><h1>热卖</h1>} />
          <Route path="/hot_show" component={()=><h1>热映 </h1>} />
          <Route path="/about" component={()=><h1>关于我们</h1>} />
          <Route path="/detail/:id" component={()=><h1>详情页</h1>} />
          <Route component={() => <h1>页面没找到</h1>} />
        </Switch>
      </Router>
    </div>
  );
}

export default App;
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容