vue 项目中在新标签页打开项目，如果已存在打开过的则直接进入，没有才打开一个新的？

Question

场景：从a页面点击按钮跳转到b页面（新开一个页面），然后在b页面进行一系列操作后，点击b页面的按钮跳回到a页面，（a,b为两个独立的浏览器页签），如果a页面已关闭，则打开一个新的页面，否则跳回到之前的a页面，这种操作，在vue中可以支持吗？

Answer 1

在chrome和edge上，你可以通过给页面设置name（window.name），然后使用window.open进行跳转，如果页面已存在会自动跳转到那个标签页，但是会刷新页面，如果页面不存在，会打开新页面

window.open('a页面路径', 'a页面name')

Answer 2

不管如何，JS都是无法跳转到某一个已经打开的标签的。但可以从另一种方式实现这个功能。

例如使用 window.open() 传入 params 的形式来打开一个弹窗来，操作完成后可以使用 window.close() 关闭弹窗。
另外使用 window.openner 可以获取 来源页（页面A）对象，就可以回到页面A了。
如果来源页被关闭了则会返回 null，这时候重新使用 window.open()（不加parama）打开页面A即可。

具体可以查看这篇文章 弹窗和 window 的方法，来了解详细情况和演示Demo。

---

但是这种情况会被很多浏览器拦截掉弹窗，所以还是需要按照实际情况来判断是否可行。

Answer 3

如果自己实现一套浏览器标签（参考element-admin），然后使用网站内的自定义标签页加vue自带的缓存功能是能实现这个目的的。