好客租房113-首页路由处理

1首页的路由进行处理

2配合默认路由 跳转到/home

3Redirect组件实现路由重定向 to跳转到要跳转的路由

import React from "react";
import {Button} from "antd-mobile"

import {BrowserRouter as Router,Route, Link, Redirect} from "react-router-dom"
//导入要使用的组件
import Home from "./pages/Home"
import CityList from "./pages/CityList"
function App() {
  return (
      <Router>
 <div className="App">
     {/* 配置路由入口 */}
    {/* <Link to="/home">首页</Link>
    <Link to="/citylist">城市数据</Link> */}
    <Route path="/" exact render={()=>
    <Redirect to="/home"/>
    }></Route>
     {/* 配置路由 */}
    <Route path="/home" component={Home}></Route>
    <Route path="/citylist" component={CityList}></Route>
    </div>
      </Router>
   
  );
}

export default App;

posted @ 2022-05-26 18:04  前端导师歌谣  阅读(19)  评论(0编辑  收藏  举报