Vue 下载本地excel，导入导出excel

需求：本地存储模板文件，前端自己下载文件，把下载下来的excel表格文件填写内容，然后导入

1.表格文件存储在前端（下载本地模板）

如图，表格文件template.xlsx存储在public下的static文件夹下

文件内容

注意这里的路径容易报错 a链接下载文件失败的问题(未发现文件） a.href = ‘./static/template.xlsx’ 写的时候不能带public，直接这么写就可以

 <el-button class="dioSave btnNew" @click="DownloadTemplate()">下载导入模板</el-button>

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()
  }

2.导入excel文件相当于上传文件

把下载下来的模板填写内容，然后上传

<el-upload ref="upload" :action="url路径+参数" multiple :on-preview="handlePicture"
   :before-upload="beforeUpload" :on-remove="handleRemove" :on-change="handleChange" :on-success="handleSuccess">
    <el-button size="small" type="primary">批量导入</el-button>
</el-upload>

<script>
methods: {
        handleRemove(file, fileList) {
            
        },
        handlePicture(file) {
            
        },
        handleSuccess(res) {
            this.$message.success(res.msg) //导入成功提示
        },
        beforeUpload(file) {
           

        },
        handleChange(file, fileList) {
        },


    },
</script>

本文章参考如下链接 链接: https://blog.csdn.net/pilgrim_121/article/details/130835016 里面还有很多丰富的知识没有写到，请大家自行阅览