问题描述

  • 今天在做个人博客的时候，想显示一张pdf，但是一直显示未能加载 PDF 文档

问题分析

  • 开始以为是方法的原因，百度找了object、iframe、embed标签来显示pdf无果(当然可以用这些方法正确显示，但是这里与不使用vue有一些区别，下面会解释到)，甚至使用了pdf.js、vue-pdf等插件来帮助显示，但都无果，这就引起了我的思考，为什么别人能正常显示的我却不能呢，甚至按照官网教程一步步写下来都是无法加载，仔细看人家的示例，仿佛都是以static目录开始的，那么是否是这个问题呢

解决问题

  • 了解了区别所在，那么接着往下想，众所周知vue-cli3生成的项目中是减少了很多配置项，包括static目录，但是仍然有public目录。满怀期待的在embed标签的src中写了 /public/xxx.pdf，仿佛并不行，还是显示未能加载PDF文档，但是已经出现了查看PDF的轮廓，但是路径好像也没有问题啊，最后才发现，原来写在 /pubilc目录下的文件不需要加上 /public，直接在src中写/xxx.pdf即可

总结

  • 其实这是一个很小的问题，就是一个路径问题，只要以后使用的时候注意即可
# 前端
Logo
Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^

avatar Vue
cover

echarts堆叠柱状图

avatar Vue

Error in v-on handler: "TypeError: Cannot read properties of undefined (reading 'current')"

这是一个 Vue.js 错误，报错信息提示在 v-on 处理程序中出现了错误：“TypeError: Cannot read properties of undefined(读取 'current')”。这意味示在您的代码中，试图读取一个未定义的变量 'current'。您需要检查您的代码，确保 'current' 已正确定义并初始化。...

avatar Vue