初学VUE当做笔记记之。
文章转载自简书
Element-UI
官网 https://element.eleme.cn/#/zh-CN/component/layout
判断是否是手机或者PC
1
2
3
4
isMobile(){
let flag = navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)
return flag;
}
(参考 易币官网)
二维码使用
参考：vue qrcode 使用
- npm 安装 qrcode
1
import QRCode from 'qrcode'
- 引入插件
1 2 3
components: { QRCode: QRCode },
-
h5
<canvas id="canvas"></canvas> - 方法中生成二维码
1 2 3 4 5 6 7
useqrcode(){ var canvas = document.getElementById('canvas') QRCode.toCanvas(canvas, this.netUrl,{width: this.width, margin:1}, function (error) { if (error) console.error(error) console.log('success!'); }) },
注意这里 {width: this.width, margin:1} 用于控制二维码宽度 (参考 易币官网)
获取URL参数
- 定义一个工具util.js
1 2 3 4 5
export default{ getUrlKey: function (name) { return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [, ""])[1].replace(/\+/g, '%20')) || null } }
-
H5代码
<router-view/> - App.vue 或者main.js
1 2 3 4 5 6 7 8 9 10
import Util from './assets/util.js' mounted() { console.log("参数id:") let id = Util.getUrlKey('id') if (id === "1") { this.$router.replace("/BCH") } else if (id === "2") { this.$router.replace("/EOS") } },
根据传参不同，显示不同页面 (参考 Buntoy钱包)
