H5页面使用js生成二维码
uniapp,vue皆可使用首先去下载qrcode.js 链接可以在根目录中新建utils文件夹,把下载的js放进去)1.引入js并创建data变量import qrcode from '@/utils/qrcode.js'data() {return {url: "",qrcodeURL: ""}},methods: {//生成url二维满creatQrCode(){this.url = win
·
uniapp,vue皆可使用
首先去下载qrcode.js 链接 可以在根目录中新建utils文件夹,把下载的js放进去)
1.引入js 并创建data变量
import qrcode from '@/utils/qrcode.js'
data() {
return {
url: "",
qrcodeURL: ""
}
},
methods: {
//生成url二维满
creatQrCode(){
this.url = window.location.href //获取当前页面链接url
// this.url = 'https://stbzmall.oss-cn-guangzhou.aliyuncs.com/apk/youfenqi.apk? versionId=CAEQDBiBgMD3xI_R2RciIGNiYzQzYmM2NjRiYzQ5MmViMjJkMDU3MmM2MDA3NmM3'
let params = this.url; // 二维码参数
var imgData = qrcode.drawImg(params, {
typeNumber: 4, // 密度
errorCorrectLevel: 'L', // 纠错等级
size: 800, // 白色边框
})
this.qrcodeURL = imgData
},
}
2.页面使用
<view class="qrcode_img" >
<img :src="qrcodeURL" mode="aspectFit"></img>
</view>
<style>
// 二维码
.qrcode_img {
width: 200px;
height: 200px;
display: flex;
justify-content: center;
margin: 0 auto;
img {
width: 800px;
height: 200px;
}
}
</style>
更多推荐
已为社区贡献7条内容
所有评论(0)