input文件上传

最近做项目，遇见了一些问题，特此记录一下。

图片上传问题

由于input的type=‘file’时，change事件会判断上传文件是否一样，如果不一样，才会触发该事件。因此，就导致了一个问题，前后2次上传的图片文件一样，就不会触发上传事件。

解决方法：
在图片重置的时候：
document.getElementById('***').value = ''
重置该input框的value值

图片下载问题

利用a标签进行下载。

export function download(id, fileName='xiaoming'){
	// 这里一定要获取到所需下载的图片或者canvas这种
    const dom = document.querySelector(`#${id}`)
    const imgUrl = dom.toDataURL()
    
    let a = document.createElement('a')
    
    a.download = fileName;
    // 下载地址
    a.href = imgUrl
    document.body.appendChild(a);
    // 触发下载
    a.click();
    document.body.removeChild(a);
    // document.appendChild: 有可能会报错
}

这篇好文章是转载于：学新通技术网