function drawCanvas2(ePage, path, name, index, width,height) {

//  path为可用的图片链，width和height为计算出的适应图片的宽高

     ePage.setData({

       width:width,

       height:height

     })   // 此处是对canvas标签的宽高进行适应性改变，每次根据传入的大小动态改变canvas组件宽高

console.log(ePage.data.width,ePage.data.height)

           index = parseInt(index)

 

           const ctx = wx.createCanvasContext(name, ePage)

           ctx.clearRect(0, 0, width, height)

            ctx.save()

 

           ctx.drawImage(path, 0, 0, width, height)

           // const pattern = ctx.createPattern(path, ‘no-repeat’)

           // ctx.fillStyle = pattern

           // ctx.fillRect(0, 0, width * 0.15, width * 0.15)

…

           ctx.save()

            ctx.draw()

 

        wx.canvasToTempFilePath({ …// 此处为保存图片或者将绘画好的图片链接赋值到image标签})

}

“当只运行一次上述方法时，在开发者工具上显示正确的，然而在真机上canvas的宽高为上一次定义的大小”；

假如：①width =800 height = 800 为默认值，现在传入width=500 height=500 ；当在真机上进行上述方法运行wx.canvasToTempFilePath时保存的图是在width=800 height=800 上绘画的效果， ② 再次运行，传入width=600 height=600  canvas绘制的大小是width=500 height=500 上的，

 进行代码适应上述改变：在方法执行前执行以下代码：

const ctx = wx.createCanvasContext(name, ePage)

           ctx.clearRect(0, 0, width, height)

ctx.draw();

注：先进行一次绘画使得宽高改变为想要的值再运行主方法，在真机上效果实现了，然而变的稍微卡了点，在开发者工具中无法将图片的链接赋值到image标签进行显示

开发者工具输出显示如下图，未运行至箭头处，ctx.draw()无输出 未执行，

然而在真机上运行正确，代码如下图