文章目录
- 1. 插件选型
- 2. 页面部分
- 3.事件部分
1. 插件选型
uqrCode
点击安装即可
https://ext.dcloud.net.cn/search?q=uqrCode
2. 页面部分
template：
<view class="canvas-qrcode-box" style="align-self: center;"><canvas id="qrcode" canvas-id="qrcode" style="width: 170px;height: 170px;align-self: center;" /></view>
3.事件部分
<script>var system = uni.getSystemInfoSync();import uQRCode from '@/uni_modules/Sansnn-uQRCode/components/uqrcode/common/uqrcode.js'export default {data() {return {vlogId: "",// screenHeight: system.screenHeight,screenHeight: system.safeArea.bottom,statusBarHeight: system.statusBarHeight}},onReady() {var vlogId = this.vlogId;var content = {type: "vlog",content: vlogId};var contentStr = JSON.stringify(content);uQRCode.make({canvasId: 'qrcode',componentInstance: this,size: 170,margin: 10,text: contentStr,backgroundColor: '#ffffff',foregroundColor: '#0f0827',fileType: 'png',errorCorrectLevel: uQRCode.errorCorrectLevel.H}).then(res => {})},onLoad(params) {var vlogId = params.vlogId;this.vlogId = vlogId;},methods: {close() {uni.navigateBack({delta: 1,animationType: "slide-out-bottom"})},}}
</script>
