react-router-dom v6文档
2021-11-10 17:44:39
# react-router-dom v6文档
## Switch 重命名为Routes
```
// v5
<Switch>
<Route exact path="/"><Home /></Route>
<Route path="/profile"><Profile /></Route>
</Switch>
// v6
<Routes>
<Route path="/" element={<Home />} />
<Route path="profile/*" element={<Profile />} />
</Routes>
```
> 注意 <Route path="profile/*" element={<Profile />} /> 的path的后面有`*`号
## props.match 变成 useParams
```
import { Routes, Route, useParams } from "react-router-dom";
function App() {
return (
<Routes>
<Route path="blog/:id" element={<BlogPost />} />
</Routes>
);
}
function BlogPost() {
// 获取参数id
let { id } = useParams();
return (
<>
</>
);
}
```
## history的用法也将被替换成：
```
// v5
history.push('/home');
history.replace('/home');
// v6
navigate('/home');
navigate('/home', {replace: true});
```
