qs
是一个用于处理 URL 查询参数的 JavaScript 库。它的主要作用是将 JavaScript 对象序列化为 URL 查询字符串,或者将 URL 查询字符串解析为 JavaScript 对象。
在代码中,qs.stringify(route.query)
的作用是将路由的查询参数对象(route.query
)转换为形如 key1=value1&key2=value2
的查询字符串,方便拼接到 URL 中作为 iframe 的源地址参数。
例如,如果 route.query
是 { name: 'test', age: 18 }
,经过 qs.stringify
处理后会得到字符串 name=test&age=18
,再加上前缀 ?
后,就可以作为完整的查询参数部分拼接到 URL 中。
getIframeUrl(route){
// 从路由元信息中获取基础iframe地址
let url = route.meta.iframeUrl
// 处理自定义iframe地址场景:当meta.iframeUrl为'diy'时,从路由查询参数中获取实际url
if(url == 'diy') {
url = route.query.url
// 如果查询参数中没有url,则返回上一页
!url && this.$router.go(-1)
}
// 处理完整URL(带http/https协议):直接返回该地址
if (url.indexOf('http') == 0 || url.indexOf('https') == 0) {
return url
} else {
// 处理相对路径:拼接当前网站域名和查询参数
let queryString = '';
// 序列化路由的查询参数(如?name=test&age=18)
queryString = qs.stringify(route.query)
// 如果有查询参数,添加问号前缀
if(queryString != '') queryString= '?'+ queryString;
// 拼接当前域名 + 相对路径 + 查询参数,作为最终iframe地址
return window.location.origin + url + queryString
}
}