1. Non-vue projects : Under normal circumstances, we are accustomed to putting local files in the current folder, and then they can be downloaded normally
2. Vue project: Let's still put the local files in the current folder
The error mentioned in the title appeared as follows:
Solution: Put the local file in the static folder, it's fine
Method 1: still use the a tag
<el-button>
<a href="../../../static/解决vue上传数据模板.xlsx" download>下载</a>
</el-button>
Since the a tag has its own click style, which may affect the style of our own buttons, the second one can be used
Method 2: Click event
<el-button @click="downloadExcel" type="primary">
下载导入模板
</el-button>
downloadExcel() {
// // window.location.href="http://localhost:80/static/解决vue上传数据模板.xlsx" ;
window.location.href="/static/解决vue上传数据模板.xlsx.xlsx"
},
Both have the same effect, and the results are as follows:
At this point the problem has been resolved.