React系统学习（二）生态链

生态系统有服务端渲染等，暂只对路由以及状态管理做部分记录。

路由Router

1. useParams：获取动态路由的路径值
2. <NavLink />：带样式的声明式路由
3. useNavigate：编程式路由

1. 第一个参数：跳转路径
2. 第二个参数（state）：携带信息对象

4. useLocation
5. useSearchParams：可以结构，同useState，第二个参数同样可以设置浏览器地址栏的url params
6. lodaer：路由表的字段，路由跳转前的处理函数，支持异步，这里做调取权限查询接口等逻辑

1. 如果返回值需要重定向指定url -> return redirect('login')

7. meta：自定义元信息

1. 组件中获取元信息：matchRoutes和useLocation

const location = useLocation()
const matchs = matchRoutes(routes, location)
const meta = matchs[matchs.length - 1].route.meta

状态管理Redux

Redux是一个独立的状态管理的库。

1. react-redux：对于redux封装至更符合react理念的库

1. useSelector
2. useDispatch

2. Redux-Toolkit：

1. 封装redux的大多数操作
2. 优化异步处理createAsyncThunk

3. redux-persist：数据持久化处理