react-router-dom

Posted усил

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了react-router-dom相关的知识,希望对你有一定的参考价值。

一:前期准备

页面 Home

import React from \'react\'
const Home = () : React.FC => 
    return (
        <div>Home 页面</div>
    )

export default Home

页面 About

import React from \'react\'
const About = () : React.FC => 
    return (
        <div>About 页面</div>
    )

export default About

页面 detail

import React from \'react\'
const detail = () : React.FC => 
    return (
        <div>detail 页面</div>
    )

export default detail

二:v5 路由配置

1、基本使用

  • src/router/App.tsx

    • exact:使用精准匹配
    • Switch:每次只会渲染一条路由
    • Redirect

以上是关于react-router-dom的主要内容,如果未能解决你的问题,请参考以下文章

react-router-dom v5和react-router-dom v6区别

反应:'重定向'不是从'react-router-dom'导出的

尝试导入错误:“Switch”未从“react-router-dom”导出

React-router-dom (v6) 和 Framer Motion (v4)

React使用react-router-dom配置路由

“react-router-dom”中的 useLocation 返回意外对象