我们在canvas上绘制多行文本的时候，不可能一行一行的绘制，这时就需要到了换行这个功能。
文本换行
参数：1、canvas对象，2、文本 3、距离左侧的距离 4、距离顶部的距离 5、(不用管)6、文本的宽度
//文本换行 参数：1、canvas对象，2、文本 3、距离左侧的距离 4、距离顶部的距离 5、6、文本的宽度 drawText: function(ctx, str, leftWidth, initHeight, titleHeight, canvasWidth) { var lineWidth = 0; var lastSubStrIndex = 0; //每次开始截取的字符串的索引 for (let i = 0; i str.length; i++) { lineWidth += ctx.measureText(str[i]).width; if (lineWidth canvasWidth) { ctx.fillText(str.substring(lastSubStrIndex, i), leftWidth, initHeight); //绘制截取部分 initHeight += 16; //16为字体的高度 lineWidth = 0; lastSubStrIndex = i; titleHeight += 30; } if (i == str.length - 1) { //绘制剩余部分 ctx.fillText(str.substring(lastSubStrIndex, i + 1), leftWidth, initHeight); } } // 标题border-bottom 线距顶部距离 titleHeight = titleHeight + 10; return titleHeight },使用方法跟普通方法是一样的：
_this.drawText(context, content, 74, 286, 148, 227);
