如何解决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 相关文章推荐
jQuery 行级解析读取XML文件(附源码)
Oct 12 Javascript
jquery 操作日期、星期、元素的追加的实现代码
Feb 07 Javascript
Struts2的s:radio标签使用及用jquery添加change事件
Apr 08 Javascript
js使下拉列表框可编辑不止是选择
Dec 12 Javascript
使用js实现关闭js弹出层的窗口
Feb 10 Javascript
JS中JSON对象和String之间的互转及处理技巧
Apr 06 Javascript
vue基于Vue2.0和高德地图的地图组件实例
Apr 28 Javascript
JS使用tofixed与round处理数据四舍五入的区别
Oct 25 Javascript
axios进阶实践之利用最优雅的方式写ajax请求
Dec 20 Javascript
vue 组件中添加样式不生效的解决方法
Jul 06 Javascript
vue改变循环遍历后的数据实例
Nov 07 Javascript
ES2020系列之空值合并运算符 '??'
Jul 22 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 获得汉字拼音首字母的函数
2009/08/01 PHP
一步一步学习PHP(3) php 函数
2010/02/15 PHP
php上的memcache和memcached两个pecl库
2010/03/29 PHP
PHP使用ob_start生成html页面的方法
2014/11/07 PHP
Yii2隐藏frontend/web和backend/web的方法
2015/12/12 PHP
PHP操作MySQL中BLOB字段的方法示例【存储文本与图片】
2017/09/15 PHP
javascript 限制输入脚本大全
2009/11/03 Javascript
jQuery图片滚动图片的效果(另类实现)
2013/06/02 Javascript
IE6下拉框图层问题探讨及解决
2014/01/03 Javascript
z-blog SyntaxHighlighter 长代码无法换行解决办法(jquery)
2014/11/16 Javascript
javascript实现数组中的内容随机输出
2015/08/11 Javascript
微信小程序 input输入及动态设置按钮的实现
2017/10/27 Javascript
最新Javascript程序员面试试题和解题方法
2017/11/23 Javascript
vue实现前进刷新后退不刷新效果
2018/01/26 Javascript
关于echarts在节点显示动态数据及添加提示文本所遇到的问题
2018/04/20 Javascript
Vue框架下引入ActiveX控件的问题解决
2019/03/25 Javascript
js实现mp3录音通过websocket实时传送+简易波形图效果
2020/06/12 Javascript
javascript+Canvas实现画板功能
2020/06/23 Javascript
[00:35]DOTA2上海特级锦标赛 MVP.Phx战队宣传片
2016/03/04 DOTA
用Python从零实现贝叶斯分类器的机器学习的教程
2015/03/31 Python
详解Python中的条件判断语句
2015/05/14 Python
Python实现程序的单一实例用法分析
2015/06/03 Python
python利用urllib和urllib2访问http的GET/POST详解
2017/09/27 Python
django 2.0更新的10条注意事项总结
2018/01/05 Python
详解Django+Uwsgi+Nginx的生产环境部署
2018/06/25 Python
Python 批量读取文件中指定字符的实现
2020/03/06 Python
pycharm第三方库安装失败的问题及解决经验分享
2020/05/09 Python
Python爬取网页信息的示例
2020/09/24 Python
TensorFlow低版本代码自动升级为1.0版本
2021/02/20 Python
外语系毕业生找工作的求职信
2013/11/28 职场文书
晚会主持词开场白
2014/03/17 职场文书
2014年数学教师工作总结
2014/12/03 职场文书
2015年政教主任工作总结
2015/07/23 职场文书
推广普通话主题班会
2015/08/17 职场文书
关于做家务的心得体会
2016/01/23 职场文书
MySQL数据库表约束讲解
2022/06/21 MySQL