vue中移动端调取本地的复制的文本方式


Posted in Javascript onJuly 18, 2020

我就废话不多说了,大家还是直接看代码吧~

_this.$vux.confirm.show({
     title: '复制分享链接',
     content: ‘分享的内容',
     onConfirm() {
      // _this.$vux.toast.text('复制成功')
      let url = ‘分享的内容';
      let oInput = document.createElement('input');
      oInput.value = url;
      document.body.appendChild(oInput);
      oInput.select(); // 选择对象;
      document.execCommand("Copy")
      document.body.removeChild(oInput);
      document.activeElement.blur();//屏蔽默认键盘弹出;
      if (oInput.value) {
       _this.$vux.toast.text('复制成功,去分享吧')
      }else {
       _this.$vux.toast.text('复制失败')
      }
     },
     onCancel() {
      _this.$vux.toast.text('复制失败')
     }
    })

补充知识:vue移动端-本地调试的两个方法

1.通过局域网ip访问——更改项目的host配置

1) vue-cli2: config/index.js

dev.host改为"0.0.0.0",重启之后就可以通过本地ip或者localhost访问

2)vue-cli3:vue.config.js

devServer.host 改为"0.0.0.0",重启之后就可以通过本地ip或者localhost访问

3) script的dev后面加 --host 0.0.0.0

2.局域网charles+host映射(也可解决跨域)

a. charles菜单proxy->Proxy Settings:

【HTTP Proxy】 Port写上8089(随意)

勾选 Enable transparent HTTP proxying

b.手机wifi设置代理

安卓手机在已连接wifi长按---修改网络(其他手机自查)--显示高级选项--代理--手动:

服务器主机名:填上你本地的ip:如192.168.100.1

服务器端口:跟charles设置的Port一致(8089)

然后保存,这时charles会弹窗询问,点allow即可

c.vue项目要运行在80端口,修改方法参照1方法,但改的是port字段,改为80

d.改hosts文件。win系统在C:\Windows\System32\drivers\etc\hosts

127.0.0.1 www.baidu.com(域名自己决定)

e.使用http协议,访问http://www.baidu.com,就可以访问你本地vue运行的代码了

f.查看是否抓包成功,看network的app.js是否携带hash值,如果没有就是映射成功了

ps:hosts文件可能会有缓存

以上这篇vue中移动端调取本地的复制的文本方式就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
ExtJS 2.0实用简明教程 之获得ExtJS
Apr 29 Javascript
Jquery的hover方法让鼠标经过li时背景变色
Sep 06 Javascript
Javascript表格翻页效果的具体实现
Oct 05 Javascript
JS弹出层的显示与隐藏示例代码
Dec 27 Javascript
javascript中parseInt()函数的定义和用法分析
Dec 20 Javascript
文字垂直滚动之javascript代码
Jul 29 Javascript
Zero Clipboard实现浏览器复制到剪贴板的方法(多个复制按钮)
Mar 24 Javascript
jQuery日程管理控件glDatePicker用法详解
Mar 29 jQuery
package.json文件配置详解
Jun 15 Javascript
在 React、Vue项目中使用SVG的方法
Feb 09 Javascript
借助云开发实现小程序短信验证码的发送
Jan 06 Javascript
vue 基于abstract 路由模式 实现页面内嵌的示例代码
Dec 14 Vue.js
vue中用 async/await 来处理异步操作
Jul 18 #Javascript
vue 使用async写数字动态加载效果案例
Jul 18 #Javascript
vue-router为激活的路由设置样式操作
Jul 18 #Javascript
解决Vue @submit 提交后不刷新页面问题
Jul 18 #Javascript
vue+elementui实现点击table中的单元格触发事件--弹框
Jul 18 #Javascript
vuejs element table 表格添加行,修改,单独删除行,批量删除行操作
Jul 18 #Javascript
vue element table中自定义一些input的验证操作
Jul 18 #Javascript
You might like
如何批量清理系统临时文件(语言:C#、 C/C++、 php 、python 、java )
2016/02/01 PHP
php使用glob函数遍历文件和目录详解
2016/09/23 PHP
PHP常用算法和数据结构示例(必看篇)
2017/03/15 PHP
ThinkPHP5.0框架实现切换数据库的方法分析
2019/10/30 PHP
jquery 应用代码 方便的排序功能
2010/02/06 Javascript
Javascript生成json的函数代码(可以用php的json_decode解码)
2012/06/11 Javascript
javascript设计模式 封装和信息隐藏(上)
2012/07/24 Javascript
js实现类似MSN提示的页面效果代码分享
2015/08/24 Javascript
跟我学习javascript的Date对象
2015/11/19 Javascript
基于jQuery插件实现点击小图显示大图效果
2016/05/11 Javascript
vue从使用到源码实现教程详解
2016/09/19 Javascript
浅谈jquery上下滑动的注意事项
2016/10/13 Javascript
利用jquery实现下拉框的禁用与启用
2016/12/07 Javascript
JS正则表达式之非捕获分组用法实例分析
2016/12/28 Javascript
运用jQuery写的验证表单(实例讲解)
2017/07/06 jQuery
JavaScript中.min.js和.js文件的区别讲解
2019/02/13 Javascript
React精髓!一篇全概括小结(急速)
2019/05/23 Javascript
Python中二维列表如何获取子区域元素的组成
2017/01/19 Python
Python 将pdf转成图片的方法
2018/04/23 Python
基于Python的ModbusTCP客户端实现详解
2019/07/13 Python
python 字典 setdefault()和get()方法比较详解
2019/08/07 Python
Python2.x与3​​.x版本有哪些区别
2020/07/09 Python
python 制作python包,封装成可用模块教程
2020/07/13 Python
css3过渡_动力节点Java学院整理
2017/07/11 HTML / CSS
详解CSS3中@media的实际使用
2015/08/04 HTML / CSS
基于HTML5超酷摄像头(HTML5 webcam)拍照功能实现代码
2012/12/13 HTML / CSS
美国孩之宝玩具官网:Hasbro Pulse
2019/06/24 全球购物
党员干部2014全国两会学习心得体会
2014/03/10 职场文书
文明好少年事迹材料
2014/08/19 职场文书
工商局局长个人对照检查材料思想汇报
2014/09/23 职场文书
2014办公室年度工作总结
2014/12/09 职场文书
趣味运动会开幕词
2015/01/28 职场文书
教师法制教育培训学习心得体会
2016/01/14 职场文书
.Net Core导入千万级数据至Mysql的步骤
2021/05/24 MySQL
Spring整合Mybatis的全过程
2021/06/28 Java/Android
mysql实现将字符串字段转为数字排序或比大小
2022/06/14 MySQL