情况1:普通页面,canvas绘制,正常,生成图片正常;
情况2:自定义组件引用canvas绘制,空白;
原因:查看文档,在自定义组件内需要手动传入当前实例的this,否则canvas指向的this为父组件所以无法找到正确canvas;
情况3:自定义组件内,canvas绘制好了,但是canvasToTempFilePath
报fail canvas is empty
错误;
原因:同上,但是canvasToTempFilePath({}, this)
添加this
可能无法解决,因为我使用的小程序框架是Taro
,在 Taro 的页面和组件类中,this
指向的是 Taro页面或组件实例。
所以一般我们需要获取 Taro的页面和组件所对应的小程序原生页面和组件实例
,这个时候我们可以通过 this.$scope
访问到它们;
所以最后写成:
Taro.createCanvasContext("canvas-id", this.$scope);
Taro.canvasToTempFilePath({}, this.$scope);