前端下载File类型文件

最新推荐文章于 2024-03-30 16:10:40 发布

一路追求匠人精神

最新推荐文章于 2024-03-30 16:10:40 发布

阅读量531

点赞数 9

文章标签：前端

本文链接：https://blog.csdn.net/qq_36566924/article/details/134640292

版权

本文介绍了如何使用JavaScript在前端通过FileReaderAPI读取File类型文件，并利用aDownload函数创建临时链接实现文件的下载，包括设置href,download属性以及模拟点击过程。

摘要由CSDN通过智能技术生成

//前端下载File类型文件
const downloadFileByFile = (file: File) => {
	const reader = new FileReader()
	reader.onload = () => {
		const dataURL = reader.result as string
		aDownload(dataURL, file.name)
	}
	reader.readAsDataURL(file)
}

const aDownload = (url, name) => {
	// 创建<a>元素
	const link = document.createElement("a")
	// 设置<a>元素的属性
	link.href = url
	link.download = name
	// 将<a>元素添加到文档中
	document.body.appendChild(link)
	// 触发点击事件
	link.click()
	// 移除<a>元素
	document.body.removeChild(link)
}