3.前端vue实现pdf文件的在线预览

我是通过 <iframe> 标签就可以满足我工作的 pdf预览需求 如果<iframe> 无法满足需求 ， 可以使用pdf.js这个插件，功能强大。

<iframe
    :src="url"
    type="application/x-google-chrome-pdf"
    width="100%"
    height="100%" />
    
export default {    
    data() {
        return {
            url: ``,
        };
}      

mounted() {
        this.url=`http://192.168.1.110:5000/assets/doc/xx调度方案7.pdf`;
    }
游览器中在线的内容

1612831-20190326201447797-943584610.png

这是控制台中有关pdf的内容

1612831-20190326202049491-279556047.png

可以看到 ， 之前的 <iframe /> 标签被替换成<embed> , 而且游览器会自动增加相关pdf的插件

转载于:https://www.cnblogs.com/JinXinYuan/p/10603146.html

# javascript # 前端
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