dav url prams与组件挂载的集几种解决方案

450 阅读2分钟

最近二个礼拜接触了dva,使用dva快速地实现了一个管理平台,用到的技术是基于dva+antd+webpack。不得不说,dva对于react,redux系列的封装真的挺妙的,使用起来非常方便。而结合antd使得组织界面非常的快,antd的各种组件还得基本所有的控件都不用自己再花心思造轮子。但是遇到了一个比较棘手的问题,是同一个菜单不同标签的情况,因为同一个菜单的url pathman是一样的,不同的是url search是不同的,但是react-reouter是对应的router组件是识别到url pathman的。

全局key

如果要让router对应到search,基于不同的search,就可以重新挂载组件,但是这个是全局的key,侵入性太强。但是可以实现我们希望的不同url search 重新挂载组件。但是放入系统中,基于系统的设计,左侧菜单栏下面有2个tab,tab 2是我们的保存标签页面,点击了标签页面,是可以重新挂载,但是因为重新挂载了全局的touter,所以导致sidermenu重新挂载,菜单就跳回到菜单tab,这并不是我们想要的结果。而且本身这种key的设置基于全局,侵入性特别的强,性能上也是下下之选。

组件加key

普通的component加可key,既可以标识该组件的唯一性,在diff的时候,会根据其key是否一致来决定是否重新挂载,key只要在其同级层级是唯一性就可以,不要求全局唯一性(基于diff算法是同级对比策略)。

结合的redux的组件的key设置

结合了redux的组件,redux管理数据通过connnct挂载到react component上。