vue-element-admin icon indicating copy to clipboard operation
vue-element-admin copied to clipboard

tagsview 组件 改造成 可以在路由配置是否允许同一个组件有多个tag

Open xdqsgit opened this issue 4 years ago • 4 comments

Feature request(新功能建议)

我在使用 此模板进行开始时候遇到一个问题 我这边是 详情页 类似 detail/123 detail/456 我不想打开两个tab 经过一番折腾之后实现了 后来发现 其实多开tag 也是有需求的 所以就在想 能不能让我们的模板直接支持配置的方式控制 tag是否可以多开呢? 下面是我在gitter的留言 和解决的过程

可以请问下: 同一标签页多开,例如:/test/1562223880638,/test/1562223894401,这样可以实现多开,也能各自刷新,但是关闭其中一个标签页时,另一个标签页会出现刷新重置的现象,这种有办法解决吗?

我和这位老兄相反 我这边是 详情页 类似 detail/123 detail/456 我不想打开两个tab 怎么操作?

解决了 tagsview 组件 里 的 routeview 的 to属性 绑定上 params 值 同时该组件监听了 $route 会去触发 store/modules/tagsview 里的ADD_VISITED_VIEW mutation 将这个 方法替换为 for (let v of state.visitedViews) { if (v.path === view.path || v.name === view.name) { v = Object.assign(v, view) return } } state.visitedViews.push( Object.assign({}, view, { title: view.meta.title || 'no-name' }) ) 即找存储的 访问路由里 name值相同的 有的话 更新他 没有的话 把这个路由加进去 另一个触发 ADD_CACHED_VIEW 修改的 可以不理会 原来的代码是按 path对比 路由参数不一样 就会重新打开一个标签 现在是用name对比 (要求不能有name相同的路由) 同时 在tagview上绑了 路由的参数 防止切到其他标签 在切回来 路由定位错误

这么做有个弊端 如果需要有 根据参数 不同 来做 不同的路由的 比如 订单列表 下面3个菜单 已发货 待发货 已完成 3个子菜单 用的是一个组件 只是根据参数不同 来请求不同的数据 这种就 没法做了 为了兼容这种菜单 目前能想到的就是 配置 路由的 meta 属性 在里面自定义属性 比如 sinlgable 为的true的 在ADD_VISITEDVIEW 里判断的时候 就不根据name 来判断 这样就又能愉快的 多开了 机智~~

还请作者参考 希望能为开源贡献一份力 另外 476428413 技术交流群 欢迎大家

xdqsgit avatar Jul 12 '19 16:07 xdqsgit