1. uniapp插件市场查找二维码
2. 选择【二维码 条形码生成 支持链接 支持nvue 支持纯文字】,作者:沐尘
3. 导入到项目,文档说明
4. 注意事项:
1)图片在非app/小程序平台是base64,在app和小程序平台是图片地址
2)长按保存图片
async SaveCode (){//保存二维码图片~
const res = await this.$refs.qrcode.saveImg()
console.log(res)
},
图片地址: 调用uni.canvasToTempFilePath(object, component)
支付宝(返回的是图片地址): 调用uni.saveImageToPhotosAlbum(OBJECT)
H5(返回的是base64): 调用我们一般在网页上下载图片的那种方式
(具体调用api可以参考uniapp官网)
5. 完整代码
<template>
<view>
<w-qrcode :options='options' ref="qrcode" @generate="hello"></w-qrcode>
</view>
</template>
<script>
export default {
data() {
return {
options:{
code:'Z5A1J000003N',
size:400,
},
}
},
methods:{
async SaveCode (){//保存二维码图片~
const res = await this.$refs.qrcode.saveImg()
console.log(res)
},
hello (res) {//二维创建成功失败 都会触发
console.log(res)
this.codeSaveImg = res.img.tempFilePath;
console.log(this.codeSaveImg);
}
}
}
</script>