let CanvasWidth = 375 //生成证书用
let CanvasHeight = 303 //生成证书用
let ctx = uni.createCanvasContext('examCanvas',this);
let bgimg = await getImagePath('https://cdn-runtime.ggjtaq.com/app/mp-lc.png')
let tampimg = await getImagePath('https://cdn-runtime.ggjtaq.com/app/mp-stamp.png')
ctx.drawImage(bgimg, 0, 0, CanvasWidth,CanvasHeight)
ctx.draw(false, () => {
setTimeout(() => {
console.log('绘画完成')
uni.canvasToTempFilePath({
canvasId: 'examCanvas',
width: CanvasWidth,
height: CanvasHeight,
success: (res) => {
console.log('生成成功', res)
fn(res)
},
fail: (err) => {
console.log('生成失败', err)
},
complete() {
uni.hideLoading();
}
})
}, 500)
})
合肥前端小菜鸡
- 发布：2022-06-09 15:49
- 更新：2022-06-09 18:00
- 阅读：895
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： Windows 10
HBuilderX类型： 正式
HBuilderX版本号： 3.4.14
手机系统： Android
手机系统版本号： Android 10
手机厂商： 华为
手机机型： 华为p20
页面类型： nvue
vue版本： vue2
打包方式： 离线
项目创建方式： HBuilderX
示例代码：
操作步骤：
新建nvue页面，引入canvas的js方法，执行
新建nvue页面，引入canvas的js方法，执行
预期结果：
生成图片
生成图片
实际结果：
无效
无效
bug描述：
【报Bug】nvue页面使用uni.createCanvasContext画图失效，在nvue页面中执行不生效，我是引入的方式执行，vue页面之前正常，现在必须传入this才可执行，nvue页面执行uni.createCanvasContext后ctx.draw()不出来图片，没反应了
