vue实现图片的下载

<el-dialog :title="title" :visible.sync="openfile" width="500px" append-to-body>
      <el-form ref="form1" :model="form1" :rules="rules">
          <img :src="form1.img"  style="width: 100%;height: 90%;" id="imageWrapper" />
          <el-button type="primary" @click="handleDown()" style="width: 100%;">下载图片</el-button>
      </el-form>
    </el-dialog> 

handleDown(){
      let link = document.createElement('a')
      let url =  this.form1.img  
      // 这里是将url转成blob地址，
      fetch(url).then(res => res.blob()).then(blob => { // 将链接地址字符内容转变成blob地址
         link.href = URL.createObjectURL(blob)
         link.download = 'pic'
         document.body.appendChild(link)
         link.click()
     })
    },