uni-app中解决canvas宽度铺满整个屏幕

一、最近在开发的时候使用到了canvas进行绘制图片，但是问题就出现了，第一个就是宽度不铺满整个屏幕在保存的时候发现。第二就是图片不清晰。

二、解决办法：利用uni-app自带的uni.getSystemInfoSync()去获取设备信息的宽高，进行计算。

三、示例代码：

// 使用canvas
<view>
    <canvas class='canvas' canvas-id='myCanvas'></canvas>
</view>

// js中进行编写  链接地址：https://uniapp.dcloud.net.cn/api/system/info.html#getsysteminfosync
const deviceInfo = uni.getSystemInfoSync()



//绘制canvas
 uni.chooseImage({
     success: function (res) {
        const ctx = uni.createCanvasContext('myCanvas')
        ctx.drawImage(res.tempFilePaths[0], 0, 0, deviceInfo.windowWidth, 380)
        ctx.draw(true)
},

这边需要注意css样式属性,宽设为100%，注意不能添加margin和padding,要不然会导致不能铺满

.canvas{
  width: 100%;
  height: 380px;
}