基于微信实现H5扫一扫功能
需求说明：在vue项目中，调用微信扫一扫接口完成扫一扫功能
H5调用微信的扫码能力的前提是在微信应用内打开页面（或者说通过微信内置浏览器打开页面）。这个过程本质上就是通过微信提供的JS接口调用微信APP的原生能力。
通过微信JSAPI调用微信扫一扫需要的资源：
1.公众号AppID,AppSecret用来获取access_token,jsapi_ticket来完成签名。商城后端对应主机IP要加入IP白名单。
2.公众号配置的JS接口安全域名，也就是权益商城页面访问的域名。域名需要已备案。
3.在公众号配置的JS接口安全域名界面，微信提供下载的类似MP_verify_L7D722ljKNHz ...
H5使用clipboardjs复制页面信息至剪贴板
需求说明：在vue项目中，设置一个按钮，点击后将页面中某个信息复制到系统剪贴板。主要使用的clipboardjs插件
一、引入clipboardjs可以使用npm命令安装，npm install clipboard –save
但我使用的方式是下载了该js文件，将clipboard.min.js放入项目某文件夹中
二、使用1、在需要复制功能的页面引入该文件
1import ClipboardJS from '@mvue/rights/common/util/clipboard.min.js
2、代码
12345678910111213141516171819202122// 页 ...
qrcode.js实现二维码展示
需求说明：在vue项目中，根据后台返回借助qrcode.js动态生成二维码展示在页面上
qrcode.js下载地址：http://davidshimjs.github.io/qrcodejs/
1、vue项目引入qrcodenpm install qrcodejs2
2、在二维码页面引入qrcodeimport QRCode from ‘qrcodejs2’
3、使用123456789101112131415//页面定义<div id="qrcode2" ref="qrcode2" class="icon-m2" style ...
H5唤起手机电话功能
记录一个简单有趣的功能，通过h5点击电话图标唤起手机拨打电话功能，以为很难，发现好简单，简单的快乐
1234 //拨打电话call: function(number) { window.location.href = 'tel:' + number; },
传入number就可以直接在显示出号码拨打
图标简易PS教程
一、图标下载
图标下载地址：https://www.iconfont.cn/home/index
在图标库选择或搜索需要的图标，点击下载按钮，选择图标颜色然后png下载
二、PS
1、打开PhotoShop软件，将图片背景拖到PS软件形成新的工程，再将刚下载的图标拖进去，按照需求改变其大小及位置
2、点击文字工具，在图标旁边录入文字
3、将图片编辑成想要的效果后，点击文件–》导出–》快速导出为png，就可以获得ps的图片
三、引用到页面
1、将新生成的png图片放在工程图片文件夹中
2、在文件app.css中设置该图标的引入类样式，其中background是设置背景图片，backgro ...
谷歌插件
极光 https://github.com/getaurora/download
vue中for循环作用域问题处理
最近在一个需求开发中，遇到作用域问题导致了疯狂报错
需求是需要在一个数组中找到typeName为生活权益N选1的对象，将其中resourceList中所有对象的expenseId拼接起来作为入参进行接口调用，如果调用返回成功则设置该对象的isReceive为0
rightsList列表格式：
1234567891011121314151617181920212223242526"rightsList": [ { "typeName": "互联网权益N选1", "isRece ...
vue中路由拦截router.beforeEach获取路径参数
vue中路由拦截router.beforeEach获取路径参数方式
地址：http://localhost:8088/rights/card?rightsId=QY21JX0802X5V3&resourceId=ZY21JX0802HVHG
在router.beforeEach获取路径参数方法
vue项目安装插件报错总结
最近一个vue项目，每次执行npm安装插件就疯狂报错，但页面需要组件居多，必须安装vant，所以为了解决这个问题，解决了一堆安装配置问题
1、 npm install 时候报错 gifsicle@5.2.0 postinstall: node lib/install.js
解决：
在命令后加参数 –ignore-scripts
1npm install --ignore-scripts
2、疯狂报错error in ./src/ass ...
css的box-shadow属性创建带阴影按钮
新需求需要绘制一个带有阴影的按钮，如下图所示
主要采用box-shadow属性，代码如下
123<div class="zfbotton-div"> <button class="zfbotton">支付</button></div>
1234567891011121314151617181920212223.zfbotton-div { position: absolute; top: 75%; height: 1rem; width: 100%; left: 50%; ...