引入iframe页面之后，如何更改顶层的跳转链接？

最近做了个需求，要上线的时候发现了个大坑，跳都跳不出来的那种！一定要把经验写下来，别再掉进坑了，丢人～～～

事情是这样的：
我们这个项目吧：主要是分为壳子和子系统们，子系统的页面通过iframe的形式进行展示，其他的功能都还好，就是跳转路由时有些一言难尽，vue的router.push是无法改变跳转链接
举个🌰：
列表页-点击查看–查看页

列表页的路由：***/***/list
查看页路由：***/***/list/view?id=1075
实际上呢，跳转到查看页路由并没有改变，依旧是列表页的路由，因为iframe嵌入的页面是无法改变外层的链接的，只要轻轻刷新一下，就会跳回列表页了，当然这个问题PM还是可以接受的，哈哈
只是，刚刚好碰到了无法接受的问题，需要在新页面打开查看页面还必须展示跳转链接上的参数，这怎么办？我当时慌的一批。。。
（1）最笨的办法，送当时的自己一个字 愚蠢 哈哈
手动拼url: 不赘述，因为实在是太鸡肋了
没啥优点，全是缺点：拼的url部分全是写死的，不灵活，只要链接稍一改变，就会出现问题，容易跳出iframe，而且不容易维护，还好这一块代码都是我维护的，就算不笑话我，也得骂死我
（2）我新学到的好方法

top.location.href: 得到的是最外层页面的链接
window.location.href: 得到的是当前页面的链接

这一块是跳转到新的页面

let baseUlr = top.location.href // 得到最顶层的url
let routeUrl = self.$router.resolve({   // 跳转页面的url
  name: 'view',
  query: {
    id: row.id
  },
})
routeUrl = baseUlr + routeUrl.href  // 拼接成最终要跳转的url
window.open(routeUrl, '_blank', 'noopener,noreferrer')  // 新页面打开

再跳回原页面

 let baseUlr =  top.location.href.substring(0,top.location.href.indexOf('/view'))  // 截断url
 window.open(baseUlr)  // 打开新页面
  window.top.location.close()  // 关闭当前页面

强调一下：必须要重新打开个页面才可，不然就会出现一种情况：路由变了，页面还是原来的页面，不管window.location.reload()还是window.top.location.reload()都不行！所以就只能打开新页面，在关闭当前页面啦。。
这个问题已经圆满解决了，希望以后可以有更好的办法来解决这个问题吧！！！
To be continued…