基于Ant Design Pro 4、Tab
公司项目有使用Ant Design Pro 4多标签多开页面的需求,网上搜索了一圈都不太符合自身需求,本着自己动手的思想就搭了一个供大家参考。
实现思路:
传统单页面路由切换时替换<content></content>
内组件,在原来的基础上嵌套一层tabs,类似<tab><content></content></tab>
;
tab内的标签状态储存到redux全局store中,在layout组件中拦截路由变化,变更store内tab数据;
要实现类型打开多个详情页面,则在tab key中加入主键参数,实现一个详情组件同时开多个详情页功能;
使用
git clone https://github.com/Fengly0503/ant_pro_tabs.git
安装依赖:
npm install
或者:
yarn
启动:
npm start
打包:
npm run build