微信小程序中使用wxml2canvas时遇到save canvas error的问题

环境:vue3,uniapp

问题:在组件中使用wxml2canvas,调用实例的draw方法报错

在这里插入图片描述

解决方法1:初始化实例的时候传入当前组件的实例

import {nextTick, ref,getCurrentInstance} from "vue"
const {proxy} = getCurrentInstance()

	const ctx = new wxml2canvas({
		element:'post-canvas',
		obj:proxy,  // <----------obj属性传入当前组件的实例
		finish(url){
		},
		error(err){
		}
	})

解决方法2:将wxml2canvas所需要的canvas画布放到页面中

在这里插入图片描述

原因:wxml2canvas默认获取到了页面的实例而不是组件的实例

思路:

查看源码,根据报错信息定位到代码片段

在这里插入图片描述

canvasToTempFilePath方法可以自行查阅小程序开发文档,源码中通过接收的options.obj接收实例,所以需要将当前组件的实例传入

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值