看其他人写的代码出现的其中的imageResource的路径是网络路径,
这个在手机端预览是有问题的图片是需要下载的
onShow: function () { const that = this;wx.downloadFile({url: that.data.img,success: function (res) {console.log(res);that.data.img = res.tempFilePath}, fail: function (fres) {
}}) },
canvasContext.drawImage
定义
绘制图像到画布。
参数
有三个版本的写法:
drawImage(dx, dy)drawImage(dx, dy, dWidth, dHeight)drawImage(sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight)从 1.9.0 起支持
图片绘制,遇到的问题使用网络路径,图片电脑端可以访问,但是手机端却不可以。console.log(name) var that = this; var context = wx.createCanvasContext('mycanvas'); var path = img; //这个地方的图片是需要注意,图片需要下载不然,手机上不能正常显示context.drawImage(path, 0, 0, 686, 686)wenzi(context,name); //绘制图片context.draw(); //将生成好的图片保存到本地,需要延迟一会,绘制期间耗时setTimeout(function () {wx.canvasToTempFilePath({canvasId: 'mycanvas',success: function (res) { var tempFilePath = res.tempFilePath;console.log(tempFilePath);wx.setStorageSync('img', tempFilePath) return tempFilePath},fail: function (res) {console.log(res);}});}, 200);