解决vue在ios或android中用webview打开H5链接时#号后面的参数被忽略问题angular同样适用
在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().split('&').forEach( function(item){
var s = item.split('=');
globalCons[s[]]=s[];
});
} 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(".")[]] = parseInt(data.split(".")[]);
});
}
var r = {}
r.name = globalCons.listType;
r.params = code;
$router.push(r); }
http://localhost:8080/#/answer?id=1509335039582001&type=60
解决vue在ios或android中用webview打开H5链接时#号后面的参数被忽略问题angular同样适用的更多相关文章
- 编写ios和android共用的c/c++库时 使用iconv的问题(转)
因为在项目中需要同时维护ios和Android,不同的代码不利于开发的便捷和以后的维护,所以在最近的一个项目中,两种手机应用的通信部分打算使用c/c++库来统一编写,ios调用.a静态库,androi ...
- Android中WebView与H5的交互,Native与JS方法互调
项目中经常用到WebView与H5的交互,一个是H5调本地方法,一个是本地调H5方法,在此记录一下. 首先,启用JS支持 //启用js支持 webSettings.setJavaScriptEnabl ...
- 小程序之web-view打开外部链接
小程序之web-view - 传送门 web-view 组件是一个可以用来承载网页的容器,会自动铺满整个小程序页面.个人类型与海外类型的小程序暂不支持使用. 一:小程序使用web-view打开链接的前 ...
- 解决 VUE 微信 IOS 路由跳转问题
watch: { "$route"(){ if (/iPhone|mac|iPod|iPad/i.test(navigator.userAgent)) { location.hre ...
- 解决Ubuntu 16.04 上Android Studio2.3上面运行APP时提示DELETE_FAILED_INTERNAL_ERROR Error while Installing APKs的问题
本人工作环境:Ubuntu 16.04 LTS + Android Studio 2.3 AVD启动之后,运行APP,报错提示: DELETE_FAILED_INTERNAL_ERROR Error ...
- WebView播放H5课件时,锁屏解锁后,页面重新绘制的问题
难题描述:H5页面播放 ,锁屏,解锁后,重新加载了页面,三星不会出现(onpause onstop ,onresume),但在小米.魅族会调用 onpause onstop ondestroy,onr ...
- Vue项目用于Ios和Android端开发
起因 前公司商城App项目使用的是H5开发,有微信公众号.Ios和Android三个版本,H5版本是自己写的一套框架,已经用了有些年头了,承载不下不断涌现出的新需求.而Ios和Android端通过we ...
- vue中解决时间在ios上显示NAN的问题
最近在用vue,遇到倒计时在ios上显示为NAN的问题. 因为做的是倒计时支付,思路是获取服务器时间和下单时间,再转成秒级时间戳做差值. 在网上找到说是ios 不支持例如2018-09-01 10:0 ...
- input 上传图片显示预览、调用摄像头,ios和Android的兼容性解决
html代码: <img id="pic" src="img/pic.png"/> </span><input id=" ...
随机推荐
- IT职场: 选择外企利与弊
前几天有个同学打电话问我选择国内企业与外企的利弊,很可笑的是他是学机械的:既然和我完全不在一个行业,因此我只是说了我们IT外企的利与弊,毕竟隔行如隔山. 首先简单自我介绍一下,我所在的公司是美资500 ...
- android studio中使用lambda
环境准备 如果还没有安装Java 8,那么你应该先安装才能使用lambda和stream(译者建议在虚拟机中安装,测试使用). 像NetBeans 和IntelliJ IDEA 一类的工具和IDE就支 ...
- [WinForm]最小化到系统托盘,右键退出
1.拉出一个notifyIcon1到用户界面,也可以NEW一个 2.拉出一个ContextMenuStrip控件,命名为mymenu,集合中增加退出 3.notifyIcon1的属性ContextMe ...
- 《java入门第一季》之好玩的正则表达式
先不通过正则表达式来判断输入的qq号码是否正确. import java.util.Scanner; /* * 校验qq号码. * 1:要求必须是5-15位数字 * 2:0不能开头 * * 分析: * ...
- 《java入门第一季》之正则表达式常见规则
正则表达式规则不用记住,只是知道是做什么用的即可.常见规则如下: A:字符 x 字符 x.举例:'a'表示字符a \\ 反斜线字符. \n 新行(换行)符 ('\u000A') (\\n来表示换行) ...
- my project 中git使用过程(基本操作流程)
1.g it clone git@name:server/BM/APPS.git 则BM_APPS.git项目被下载到当前目录下了,这时git@name:server/BM/APPS.git就是自己 ...
- how tomcat works 读书笔记(二)----------一个简单的servlet容器
app1 (建议读者在看本章之前,先看how tomcat works 读书笔记(一)----------一个简单的web服务器 http://blog.csdn.net/dlf123321/arti ...
- Android官方技术文档翻译——新构建系统概述
本文译自Android官方技术文档<New Build System>,原文地址:http://tools.android.com/tech-docs/new-build-system. ...
- RecyclerView notifyItem闪烁的问题
之前我们做点赞,用listview做的话,就是在item实现点击后,写一个scal动画,不过现在都转到RecyclerView,那么要做这种效果于是做了一个notifyItemChanged()的操作 ...
- Android Studio使用Lint进行代码检查
Android Studio目前已经更新到1.4版本,它作为Google官方推荐的IDE,功能非常强大,其中提供了一套静态代码分析工具,它可以帮助我们检查项目中存在的问题,让我们更有规范性的开发App ...