如何解决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 相关文章推荐
js GridView 实现自动计算操作代码
Mar 25 Javascript
jQuery插件 tabBox实现代码
Feb 09 Javascript
js鼠标左右键 键盘值小结
Jun 11 Javascript
jquery 新浪网易的评论块制作
Jul 01 Javascript
jQuery获得内容和属性方法及示例
Dec 02 Javascript
使用jquery 简单实现下拉菜单
Jan 14 Javascript
png在IE6 下无法透明的解决方法汇总
May 21 Javascript
详解JavaScript中this关键字的用法
May 26 Javascript
12个非常有用的JavaScript技巧
May 17 Javascript
浅谈Webpack自动化构建实践指南
Dec 18 Javascript
11行JS代码制作二维码生成功能
Mar 09 Javascript
React中使用UMEditor的方法示例
Dec 27 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 数据结构 算法 三元组 Triplet
2011/07/02 PHP
php函数的常用方法及注意之处小结
2011/07/10 PHP
PHP中使用unset销毁变量并内存释放问题
2012/07/05 PHP
php单文件版在线代码编辑器
2015/03/12 PHP
php实现的用户查询类实例
2015/06/18 PHP
WordPress中获取指定分类及其子分类下的文章数目
2015/12/31 PHP
使用Zookeeper分布式部署PHP应用程序
2019/03/15 PHP
php 的多进程操作实践案例分析
2020/02/28 PHP
使用JQUERY Tabs插件宿主IFRAMES
2010/01/01 Javascript
给文字加上着重号的JS代码
2013/11/12 Javascript
用循环或if语句从json中取数据示例
2014/08/18 Javascript
字段太多jquey快速清空表单内容方法
2014/08/21 Javascript
什么是MEAN?JavaScript编程中的MEAN是什么意思?
2014/12/18 Javascript
微信小程序跳转到其他网页(外部链接)的实现方法
2019/09/20 Javascript
javascript实现弹幕墙效果
2019/11/28 Javascript
JQuery常用选择器功能与用法实例分析
2019/12/23 jQuery
nuxt.js服务端渲染中axios和proxy代理的配置操作
2020/11/06 Javascript
[02:51]DOTA2战队出征照拍摄花絮 TI3明星化身时尚男模
2013/07/22 DOTA
Python 条件判断的缩写方法
2008/09/06 Python
python下调用pytesseract识别某网站验证码的实现方法
2016/06/06 Python
详解Django 中是否使用时区的区别
2018/06/14 Python
python使用xlrd模块读取xlsx文件中的ip方法
2019/01/11 Python
分享一个pycharm专业版安装的永久使用方法
2019/09/24 Python
使用turtle绘制五角星、分形树
2019/10/06 Python
pytorch构建多模型实例
2020/01/15 Python
Pytorch损失函数nn.NLLLoss2d()用法说明
2020/07/07 Python
详解python 条件语句和while循环的实例代码
2020/12/28 Python
美国面料纺织品商城:Fabric.com
2017/06/28 全球购物
英国最受欢迎的母婴精品品牌:JoJo Maman BéBé
2021/02/17 全球购物
什么是聚集索引和非聚集索引
2012/01/17 面试题
How TDD works
2012/09/30 面试题
剪枝的学问教学反思
2014/02/07 职场文书
运动会开幕式主持词
2014/03/28 职场文书
省级优秀毕业生主要事迹
2014/05/29 职场文书
国庆节演讲稿范文2014
2014/09/19 职场文书
Redis延迟队列和分布式延迟队列的简答实现
2021/05/13 Redis