如何解决vue在ios微信"复制链接"功能问题


Posted in Javascript onMarch 26, 2020

这个问题在安卓上是完全没有问题的,可是到了iPhone上就彻底失效了。因为ios微信对vue路由中的#号识别问题。

我的解决办法是在初始进入项目时重新拼接项目地址,再重定向到拼接的地址去。

先获取到#号前的路由地址,再手动添加我们的#号和当前项目地址后缀:

在路由router.js里的beforeEach函数写

截取地址

// 重定向功能,为解决ios微信上复制链接功能不能复制到动态路由问题
// 获取地址前段部分,不算参数
 var replaceUrl = window.location.href.split('#')[0] + '#' + to.path;
 var index = 0; // 索引初始化
 // 给replaceUrl拼接参数
 for (var i in to.query) {
  // 判断是否等于第一个参数
  if (index == 0) {
   // 拼接地址第一个参数,添加“?”号
   replaceUrl += '?' + i + '=' + to.query[i]
  } else {
   // 拼接地址非第一个参数,添加“&”号
   replaceUrl += '&' + i + '=' + to.query[i]
  }
  index++; // 索引++
 }

重定向跳转

window.location.replace(replaceUrl); // 重定向跳转

全部代码

router.beforeEach((to, from, next) => {  
next();
// 重定向功能,为解决ios微信上复制链接功能不能复制到动态路由问题
// 获取地址前段部分,不算参数
var replaceUrl = window.location.href.split('#')[0] + '#' + to.path;
var index = 0; // 索引初始化
// 给replaceUrl拼接参数
for (var i in to.query) {
 // 判断是否等于第一个参数
 if (index == 0) {
  // 拼接地址第一个参数,添加“?”号
  replaceUrl += '?' + i + '=' + to.query[i]
 } else {
  // 拼接地址非第一个参数,添加“&”号
  replaceUrl += '&' + i + '=' + to.query[i]
 }
 index++; // 索引++
}
// console.log('test20190117:' + to.meta.title, replaceUrl);
window.location.replace(replaceUrl); // 重定向跳转
// 重定向功能------end
});

原文链接:https://blog.csdn.net/qq_37235823/article/details/86476723

到此这篇关于如何解决vue在ios微信"复制链接"功能问题的文章就介绍到这了,更多相关vue 微信 ios复制链接内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
国外Lightbox v2.03.3 最新版 下载
Oct 17 Javascript
window.parent调用父框架时 ie跟火狐不兼容问题
Jul 30 Javascript
js更优雅的兼容
Aug 12 Javascript
jQuery 过滤方法filter()选择具有特殊属性的元素
Jun 15 Javascript
node.js中的http.response.setHeader方法使用说明
Dec 14 Javascript
js与jquery回车提交的方法
Feb 03 Javascript
jquery+ajax实现注册实时验证实例详解
Dec 08 Javascript
javascript实现在网页中运行本地程序的方法
Feb 03 Javascript
举例说明JavaScript中的实例对象与原型对象
Mar 11 Javascript
关于javascript获取内联样式与嵌入式样式的实例
Jun 01 Javascript
微信小程序实现多个按钮的颜色状态转换
Feb 15 Javascript
JavaScript数组、json对象、eval()函数用法实例分析
Feb 21 Javascript
原生JS实现留言板
Mar 26 #Javascript
vue在线动态切换主题色方案
Mar 26 #Javascript
javascript实现简单搜索功能
Mar 26 #Javascript
jQuery实现html可联动的百分比进度条
Mar 26 #jQuery
vue+element 实现商城主题开发的示例代码
Mar 26 #Javascript
js实现带箭头的进度流程
Mar 26 #Javascript
Bootstrap实现前端登录页面带验证码功能完整示例
Mar 26 #Javascript
You might like
用PHP编写PDF文档生成器
2006/10/09 PHP
输出控制类
2006/10/09 PHP
PHP实现Socket服务器的代码
2008/04/03 PHP
php递归创建目录的方法
2015/02/02 PHP
php实现网站顶踩功能的完整前端代码
2015/07/19 PHP
php微信公众平台交互与接口详解
2016/11/28 PHP
PHP多线程模拟实现秒杀抢单
2018/02/07 PHP
Smarty模板配置实例简析
2019/07/20 PHP
laravel5.6中的外键约束示例
2019/10/23 PHP
jquery选择checked在ie8普通模式下的问题
2014/02/12 Javascript
vue.js 表格分页ajax 异步加载数据
2016/10/18 Javascript
weex里Vuex state使用storage持久化详解
2017/09/09 Javascript
细说webpack源码之compile流程-入口函数run
2017/12/26 Javascript
jquery应用实例分享_实现手风琴特效
2018/02/01 jQuery
vue+element实现打印页面功能
2019/05/20 Javascript
[57:38]2018DOTA2亚洲邀请赛3月30日 小组赛A组 OpTic VS OG
2018/03/31 DOTA
[01:18:21]EG vs TNC Supermajor小组赛B组败者组第一轮 BO3 第一场 6.2
2018/06/03 DOTA
Python中用于转换字母为小写的lower()方法使用简介
2015/05/19 Python
Android 兼容性问题:java.lang.UnsupportedOperationException解决办法
2017/03/19 Python
Python 加密的实例详解
2017/10/09 Python
详谈套接字中SO_REUSEPORT和SO_REUSEADDR的区别
2018/04/28 Python
python版本五子棋的实现代码
2018/12/11 Python
Python for循环及基础用法详解
2019/11/08 Python
Python如何使用函数做字典的值
2019/11/30 Python
PyQt5事件处理之定时在控件上显示信息的代码
2020/03/25 Python
Python 字典一个键对应多个值的方法
2020/09/29 Python
Python通过字典映射函数实现switch
2020/11/06 Python
Scrapy+Selenium自动获取cookie爬取网易云音乐个人喜爱歌单
2021/02/01 Python
python opencv实现图像配准与比较
2021/02/09 Python
canvas三角函数模拟水波效果的示例代码
2018/07/03 HTML / CSS
HTML5 常用语法一览(列举不支持的属性)
2010/01/26 HTML / CSS
Python文件操作的面试题
2013/06/22 面试题
单位在职证明范本
2014/01/09 职场文书
给领导的致歉信范文
2014/01/13 职场文书
汽车维修专业自荐书
2014/05/26 职场文书
Java 多线程协作作业之信号同步
2022/05/11 Java/Android