第三弹 - React公共状态管理mobx + react-router-dom v5&v6

149 阅读1分钟

学习笔记重点:

  1. mobx语法类似Vue3中的pinia
  2. mobx的原理, V5需要装饰器的支持支持IE, V6是proxy代理不支持IE
  3. V6使用取消装饰器, 在construchor中 添加maskAutoObserbable(this)进行自动识别
  4. V5中@observable定义数据 @action.bound修改方法(处理异步不需要中间件) @cumputed get计算属性
  5. 函数组件通过高阶函数inject('store名称')(observer(组件名)) 在props中获取store
  6. 类组件使用@observer修饰,修改mobx状态后会自动更新
  7. lazy 路由懒加载
  8. react-router-dom v5 Link NavLink导航 Redirect(from,to重定向) exact(深度匹配)
  9. V5 => 需要拆分以及和二级路由 二级路由出口中导入对应的二级路由出口信息
  10. v5 => withRouter让不会Route匹配的组件或者是类组件 在props中可以获取路由信息
  11. 路由问号传参 发送useHistory 接收useLocation URLSearchParams转化 V6增加useSearchParams
  12. 路由路径传参 先挖坑 后 useParams接收
  13. 路由隐式传参 useHistory state发送 useLocation state接收 V5刷新丢失 V6刷新不会丢失
  14. V5 V6 路由组件的写法 以及 V6手写withRouter

React基础-03.png