vue中excel文件 打包后不展示问题

问题:vue获取模板excel文件时,不从接口获取,从本地文件获取,打包后出现文件不存在情况

解决办法:vue打包之后,excel放置在静态文件里

public里新建文件夹excel存放.xlsx文件

在需要展示文件的地方,通过axios解析获取文件

typescript 复制代码
<template>
  <div>
    <el-button @click="getDemoExcel">获取模板文件</el-button>
  </div>
</template>
<script setup lang="ts">
import axios from 'axios';
import { ElMessage } from 'element-plus';

const getDemoExcel = () => {
  axios.get('/excel/demo.xlsx', {
    responseType: 'blob',
  }).then((response: any) => {
    const url = window.URL.createObjectURL(new Blob([response.data]));
    const link = document.createElement('a');
    link.href = url;
    link.setAttribute('download', '模板.xlsx');
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
  }).catch((error: any) => {
    ElMessage.error('文件不存在')
  })
}
</script>

打包之后,文件与assest同级

相关推荐
恋猫de小郭3 小时前
小米 HyperOS 4 大变样?核心应用以 Rust / Flutter 重写,不兼容老系统
android·前端·人工智能·flutter·ios
李火火的安全圈3 小时前
基于Yakit、Wavely实现CVE-2025-55182(React Server Components(RSC)) 反序列化漏洞挖掘和POC编写
前端·react.js
开开心心就好3 小时前
图片校正漂白工具永久免费,矫正实时预览
网络·人工智能·windows·计算机视觉·计算机外设·电脑·excel
开开心心_Every3 小时前
音频视频转文字工具,离线语音识别免费
人工智能·游戏·微信·pdf·excel·语音识别·memcache
Orange_sparkle3 小时前
dify的web页面如何传入user用户信息进行对话,而不是uuid
前端·人工智能
开开心心_Every3 小时前
电脑网速加速工具,无线有线叠加网络
网络·游戏·微信·pdf·电脑·excel·语音识别
Amumu121383 小时前
Vue Router 和 常用组件库
前端·javascript·vue.js
霍理迪3 小时前
CSS移动端开发及less使用方法
前端·css
2601_949857433 小时前
Flutter for OpenHarmony Web开发助手App实战:HTML参考
前端·flutter·html
爱内卷的学霸一枚3 小时前
现代前端工程化实践:从Vue到React的架构演进与性能优化(7000字深度解析)
前端·vue.js·react.js