微信小程序开发中经常会涉及到图片上传压缩等情况，而在其中对小程序图片压缩相对比较合适的可能就只有使用canvas来实现了。

可当你在组件中使用canvas来实现压缩时，是否有发现canvas在组件中居然不生效，那么这是什么原因呢？

canvas组件注册无效，这个因为createCanvasContext方法是有两个参数，在page页面默认传了一个this，在组件里面需要手动传this。

wxml代码

<canvas canvas-id="canvas" style="width:200px;height:200px;"></canvas>

js代码：

const ctx = wx.createCanvasContext('canvas',this);

大家是否注意到在createCanvasContext中多传递了个this。

当你把这个this去掉和添加上后，就可以看出其中的差距了。