由上至下匹配,匹配到几次就展示几次,Routes打断后续展示

请求的url不存在,展示404页面,path属性取值为*时,可以匹配任何(非空)路径,同时该匹配拥有最低的优先级。可以用于设置404页面。

notFound.js

路由匹配规则 - 图1

App.js

//react-router-dom从V5升级到V6后,有些使用做了一些改变:Switch 重命名为 Routes

importReact, { Component } from‘react’ import {Link,Route,Routes} from‘react-router-dom’ importHomefrom‘./components/home’ importListfrom‘./components/list’ importNotFoundfrom‘./components/notFound’ classAppextendsComponent { render() { return ( <div> <div> <Linkto=“/home”>shouye</Link>—— <Linkto=“/list”>liebiaoye</Link> </div> <div> <Routes> <Routepath=“/“element={<Home/>}exact/> <Routepath=“/home”element={<Home/>}/> <Routepath=“/list”element={<List/>}/> <Route path=“*” element={<NotFound/>}/> </Routes> </div> </div> ) } } exportdefaultApp