持续创作,加速成长!这是我参与「掘金日新计划 · 10 月更文挑战」的第7天,点击查看活动详情
在ios或android如果直接用webview在打开H5链接例如:
打开:http://localhost:8080/#/answer?id=1509335039582001
会变成 http://localhost:8080/ 造成根本打开不了想要的页面(微信中获取网页授权的时候有#号也会有问题)
解决思路:链接中不写#号 打开后跳转到带#号的路由,把页面路由的代码定义为listType参数 后面的参数都先整个拼接
如这样 http://localhost:8080/?listType=answer&id=1509335039582001
我们在index中获取一下当前页面所接受到的参数:
var globalCons = {};
try{
location.search.substr(1).split('&').forEach( function(item){
var s = item.split('=');
globalCons[s[0]]=s[1];
});
} catch(e){
throw new Error(JSON.stringify(search));
}
这样页面的参数都会保存在globalCons 对象中
console.log(globalCons) // globalCons = {"listType":"answer","id":1509335039582001 }
在main.js 判断listType这个字段是否有值
if (globalCons.listType) {
var code ={}; //路由的参数
code.id = globalCons.id;
var r = {} //路由的name
r.name = globalCons.listType;
r.params = code;
$router.push(r); //解析跳转到对应页面
}
这样问题就解决了,
但即使是这样去处理,还是会有一个新的问题
路由的params需要手动去写入,这样很不爽,我想是不是可以定义一个固定格式传参时直接写好,让js自动追加参数
我们传参的时候统一传 params 这个参数 参数值为一个有规律的字符串
如:http://localhost:8080/?listType=answer¶ms=id.1509335039582001|type.60
params为我们想要追加的值
我们可以先拿到拆分的键和值 params.split("|") // ['id.1509335039582001','type.60']
在循环数组按.拆分,就拿到最终结果
//跳转到指定页面的方法
var code ={};
if (globalCons.listType) {
if(globalCons.params){
var params = globalCons.params.split("|");
params.forEach(function(data){
code[data.split(".")[0]] = parseInt(data.split(".")[1]);
});
}
var r = {}
r.name = globalCons.listType;
r.params = code;
$router.push(r);
}
http://localhost:8080/#/answer?id=1509335039582001&type=60