vue:已有图片地址，实现点击图片下载功能

项目中遇见后端返回了图片的地址，前段需要将图片保存到本地；

解决办法：

先用图片地址和图片名称生成blob对象，再使用a标签下载

这里写成了一个方法，传入图片链接和图片名称就好了

 //根据url和名称生成blob
    downloadPic(url, name) {
      let image = new Image();
      image.setAttribute("crossOrigin", "anonymous");
      image.src = url;
      image.onload = () => {
        let canvas = document.createElement("canvas");
        canvas.width = image.width;
        canvas.height = image.height;
        let ctx = canvas.getContext("2d");
        ctx.drawImage(image, 0, 0, image.width, image.height);
        canvas.toBlob((blob) => {
          let url = URL.createObjectURL(blob);
          let Link = document.createElement("a");
          Link.download = name;
          Link.href = href;
          Link.click();
          Link.remove();
          // 用完释放URL对象
          URL.revokeObjectURL(url);
        });
      };
    },