上傳文件和下載模板 - vue

• 一、下載模板
• • • 1、準備好模板文件
    • 2、寫靜態html
    • 3、寫下載模板的方法
    • 效果
• 二、上傳文件
• 持續更新

記錄一些以后會經常用到的模塊，一點一點積累…

一、下載模板

1、準備好模板文件

2、寫靜態html

<div class="base"><div class="lable">上傳設備Excel：</div><div><div class="upload"><a-uploadname="file":multiple="true"action="https://www.mocky.io/v2/5cc8019d300000980a055e76":headers="headers"@change="handleChange"accept=".xls,.xlsx"><a-button> <a-icon type="upload" /> 上傳文件 </a-button></a-upload><a @click="downloadTemplate">+下載導入模板</a></div><p class="uploadtip">支持擴展名：支持excel表上傳</p></div></div>

用的 vue + Ant Design Pro ，生成的靜態就是這樣：

3、寫下載模板的方法

windows.location.href="/url" // 當前頁面打開URL頁面 downloadTemplate() {window.location.href = '/template/devices.xlsx'; // url = 文件位置 + 文件.文件類型 },

效果

點擊下載模板，效果如下：

二、上傳文件

暫時還未寫完，后續更新…

持續更新

這里只是上傳文件和下載模板的淺顯用法，后面若有相關方法將會持續更新。

總結

以上是生活随笔為你收集整理的上传文件和下载模板的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。