vue 前端下载excel文件模板

第一步：

  //vue3.0版本的在项目public目录下新建static文件夹，放入“文件模板.xlsx”文件。//vue2.0版本的在项目根目录下的static文件夹，放入“文件模板.xlsx”文件。

第二步：
在按钮中加入事件

<el-button type="warning" @click="downloadTemplate">Excel模板下载</el-button>

第三步：
在 methods中写入如下方法：

 downloadTemplate() {let a = document.createElement("a");a.href = "./static/template.xlsx";a.download = "文件模板.xlsx";a.style.display = "none";document.body.appendChild(a);a.click();a.remove();},

可能会出现的问题：vue中通过a标签下载本地文件报错-文件，未找到

问题的解决：
原因之一：下载的模板文件的名字不可以为中文名，若为中文名会报错找不到文件；原因之二：下载的模板文件必须放在static里面，vue2.0版本的放在项目根目录下的static文件夹，但是由于vue3.0版本static取消，文件可以放在public里面，或者在public里面新建一个static文件夹，放到它里面；原因之三：也是最重要的第一点，url的路径问题，如果使用"../../public/muban.xlsx"的话，会下载一个空文件因为此时的路径不应该使用相对于当前vue页面的路径，放在public下时，应该使用相对于index.html的路径即"./"即可，然后就可以访问到了；
当然这是通过绑定在button上了，如果单纯的使用a标签下载的话同理
<a href="./static/template.xlsx" download="模板.xlsx"></a>

vue 前端下载excel文件模板相关推荐

vue前端下载excel文件
// html <el-button type="primary" plain @click="frontDownload">本地下载</el ...
vue3+vite完成前端下载excel文件/模板并规定单元格大小(纯前端)
首先当然就是下载相关的npm包了 npm install --save file-save xlsx npm install --save script-loader 然后我是在utils下面创建了一 ...
前端下载excel文件功能的三种方法
1 从后端接收json数据,前端处理生成excel下载 JsonExportExcel的github地址:https://github.com/cuikangjie/JsonExportExcel 这 ...
php下载excel文件模板文件,PHP下载excel文件变得腐败
我有一个excel文件,我希望用户能够从我的服务器下载.我在这里看了很多问题,但我找不到正确下载没有腐败的文件的方法.我假设它是标题但我还没有它们的工作组合.这就是我现在所拥有的,在我收到的损坏文件中 ...
Vue 前端下载 Excel
一.准备插件下载地址(别人CSND 免费下载,好人一生平安):https://download.csdn.net/download/hqtc0704/10642331 二.Export2Excel. ...
vue中下载excel文件
请求用的axios 请求函数封装 req.js import axios from 'axios' const api = axios.create({baseURL : _getBaseUrl(), ...
vue 前端导入excel文件，并展示出
在详细介绍前,先展示下效果技术介绍 element UI 组件的el-upload和el-table xlsx插件0.16.0版本第一步,下载xlsx插件 npm install xlsx@0.1 ...
vue 前端导入excel文件，并在页面表格展示
在详细介绍前,先展示下效果第一步,下载xlsx插件 npm install xlsx@0.16.0 在需要的文件中import导入"import xlsx form 'xlsx'" ...
web前端下载excel文件
需要的插件 jquerybootstrap table/ tableExport.jquery.plugin.js 插件 //html代码 < div class= "col-md-1 ...
IE中点击链接下载EXCEL文件直接以乱码方式打开解决
我需要在页面上通过javascript控制,点击一个链接下载excel文件模板,总觉得方法都写对了,可每次点击都是新开一个窗口,显示的全是乱码.几日以来一直被这个问题困扰,今天无意中得知这个方法,试了 ...

vue 前端下载excel文件模板

vue 前端下载excel文件模板相关推荐

最新文章

热门文章