<template xlang="wxml" minapp="mpvue">
<canvas class="tki-qrcode-canvas" canvas-id="myCanvas" style="width: 375px;height: 1143px;"></canvas>
</template>
<script>
import QRCode from "./qrcode.js"
let qrcode
export default {
name: "tki-qrcode",
data() {
return {
result: '',
saveurl:''
}
},
methods: {
imagePath(url) {
let that = this
const ctx = uni.createCanvasContext("myCanvas", that);
ctx.width = 375;
ctx.height = 1143;
ctx.drawImage(url, 0, 0, 375, 1143); // 绘制图片并改变尺寸
console.log('绘制成功1',that.result)
ctx.drawImage(that.result, 145, 960, 90, 90); // 绘制图片并改变尺寸
ctx.draw(true, () => {
uni.canvasToTempFilePath({
canvasId: 'myCanvas',
success: res => {
that.saveurl=res.tempFilePath
console.log('绘制成功', res.tempFilePath)
}
}, this);
});
},
},
}
</script>
<style>
.tki-qrcode {
position: relative;
/* background: url('https://zckj-zscq.oss-cn-shenzhen.aliyuncs.com/bff76c283ea248e7974dc4e64be1f1f4.png') no-repeat ;
background-size: 100% 100%; */
}
.tki-qrcode-canvas {
position: fixed;
top: -99999upx;
left: -99999upx;
z-index: -99999;
}
</style>
uniapp canvas
最新推荐文章于 2025-02-17 17:17:17 发布