在博主的稍前一篇文章中，寫到vue中關於將資訊生成二維碼的方法，生成的二維碼圖片是canvas所繪製，在手機端我們往往需要將手機二維碼圖片可以儲存到本地，該如何操作呢。

首先，假使生成的二維碼圖片掛載在id為target的div標籤下

<div data-v-4eb8d02a="" id="target" class="qrcode">
       <canvas width="85" height="85"></canvas>
</div>

生成canvas圖片的方法為：

$('#target').qrcode({
       text: "message",
       width: 85,
       height: 85
});
 

假使呼叫saveImg方法時，將生成的二維碼圖片儲存到本地，具體如下：

// 將canvas生成的二維碼儲存為圖片
saveImg() {
        var canvasData = $('#target').children('canvas');
        var a = document.createElement("a");
        a.href = canvasData[0].toDataURL();;
        a.download = "drcQrcode";
        a.click();
 },

當方法呼叫時，即可將生成的二維碼圖片下載到本地。