vue页面跳转打开新的窗口

原创已于 2022-03-28 17:10:57 修改 · 3.1k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js

于 2022-03-28 17:09:36 首次发布

本文介绍了一种通过iframe进行跨窗口通信的方法，并演示了如何在URL中传递参数及token，同时提供了接收与解析这些参数的JavaScript实现。

1.主页面里写入，可以在url里面拼接参数和token

window.parent.postMessage({

 type:"iframe", 
 id:"other_"+parseInt(Math.random()*100),
 title:"电路详情列表",
 // url:"https://www.baidu.com/s?ie=UTF-8&wd=baidu"
 url:CORE_CONFIG.DETAIL_URL+'?objectid=' + val.OBJECTID + '&x_token=' + getToken()
                         },"*");

2.定义一个js方法，用来接收传递得参数 getUrl()

export function getUrl(name = "x_token",complex = false) {
  var reg = new RegExp("[^\?&]?" + encodeURI(name) + "=[^&]+");
  var arr = window.location.href.match(reg);
  if (arr != null) {
    return  complex ?
  decodeURIComponent(arr[0].substring(arr[0].search("=") + 1)) :		
  decodeURI(arr[0].substring(arr[0].search("=") + 1));
  }


  return "";
}

3.准备要跳转的页面接收直接用getUrl获取参数