操作步骤：

第一步：下载包   npm install --save vue-pdf

第二步：导入组件

第三步：使用pdf标签进行展示，showUrl指的是访问路径

第四步：定义要用到的变量

第五步：处理文件流，转换成地址

最终效果：图一是我加的一个loading描述，图二是效果。

vue+antd实现PDF预览（后端返回的是文件流）的更多相关文章

  1. Android原生PDF功能实现：PDF阅读、PDF页面跳转、PDF手势伸缩、PDF目录树、PDF预览缩略图

    1.背景 近期,公司希望实现安卓原生端的PDF功能,要求:高效.实用. 经过两天的调研.编码,实现了一个简单Demo,如上图所示. 关于安卓原生端的PDF功能实现,技术点还是很多的,为了咱们安卓开发的 ...

  2. Pdf预览功能实现（asp.net）

    asp.net中使用 1.pdf预览功能实现的插件是pdfjs-1.5.188-dist //引入插件中相关的文件以及jquery文件 @section css{ <link rel=" ...

  3. PDF预览之PDFObject.js总结

    get from:PDF预览之PDFObject.js总结   PDFObject.js - 将PDF嵌入到一个div内,而不是占据整个页面(要求浏览器支持显示PDF,不支持,可配置PDF.js来实现 ...

  4. 浏览器实现PDF预览

    1.使用jquery.media.js预览PDF <!DOCTYPE html> <html> <head> <meta charset="utf- ...

  5. Atitit.pdf 预览 转换html attilax总结

    Atitit.pdf 预览 转换html attilax总结 1. Swf flash还是html1 2. pdf2htmlEX1 3. iText 5.5.0 发布,Java 的 PDF 操作类库1 ...

  6. ABAP FORM打印转PDF/pdf 预览

    function ZSTXBC_SSFCOMP_PDF_PREVIEW. *"-------------------------------------------------------- ...

  7. Winforn中使用FastReport实现点击导出按钮PDF预览并弹出另存为对话框

    场景 FastReport安装包下载.安装.去除使用限制以及工具箱中添加控件: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/10 ...

  8. 预览github项目的html文件新方法

    原文地址:→看过来 写在前面 关于如何在线预览github中的html文件,其实这是一个很多人知道的东西,但是查资料的时候呢总是找不到正确的答案,并且一开始我也是踩了坑的. 踩坑经历 搜出来的结果大概 ...

  9. vue文件流转换成pdf预览(pdf.js+iframe)

    参考文档:https://www.jianshu.com/p/242525315bf6 PDFJS: https://mozilla.github.io/pdf.js/     支持获取文件流到客户端 ...

  10. 使用pdf.js预览实现读取服务器外部文件

    不知道大家使用百度网盘的文件预览功能,f12看过控制台没有. 发现百度网盘使用的预览文件功能全是基于开源pdf .js的 接下来正题,我们在使用pdf.js默认是读取发布容器内部的文件,读取外部的文件 ...

随机推荐

  1. js防止表单重复方法

    用flag标识,下面的代码设置checkSubmitFlg标志: <script language=""javascript""> var chec ...

  2. java中线程的两种创建方式

    第一种:继承java.lang.Thread类.然后重写run方法 例如我们模拟一个龟兔赛跑 1 package edu.aeon.thread; 2 3 /** 4 * 说明:模拟龟兔赛跑 5 * ...

  3. 【PS】PS如何扩展画布？

    [PS]PS如何扩展画布? 选择裁剪,拉伸图片 选择上方工具栏的勾 即可扩展图片

  4. 掌控安全学院SQL注入靶场

    注入的本质:用户输入的字符被带入数据库中并且执行了 靶场地址:http://inject2.lab.aqlab.cn/ 第六关:http://inject2.lab.aqlab.cn/Pass-06/ ...

  5. vm-linux-格式化磁盘以及挂载

    数据盘大小20g 文件系统xfs 分区工具fdisk 1,虚拟机关机状态,打开设置新添加一个20g硬盘 2,重新启动虚拟机,并登陆linux,打开命令窗口 3,对磁盘进行分区 输入 fdisk -l ...

  6. 基于winds10 安装docker 踩坑记录

    1.官方下载 https://www.docker.com/ 2.根据提示安装 并重庆计算机3.双击运行 报 Docker Desktop is shutting down 提示  计算机c: 盘 A ...

  7. 前端性能测试lighthouse的使用

    lighthouse的安装有两种方式: github地址:https://github.com/GoogleChrome/lighthouse 一.如果可以FQ的话可以从 chrome 扩展插件里直接 ...

  8. 攻防世界-unseping（序列化，Bash shell）

    这是一道序列化的题目,结合了Linux Bash shell知识 一.基础知识点 序列化    序列化的概念:    序列化 (Serialization)是将对象的状态信息转换为可以存储或传输的形式 ...

  9. Warning: PHP Startup: Unable to load dynamic library 'php_pdo_oci.dll'处理

    出现这样提示的原因可能有以下几种: (1)没有在php.ini中将extension=php_pdo_mysql.dll前面的分号去掉 在php.ini中分号表示注释,因为在配置时被注释掉了,所谓无法 ...

  10. 修改Linux终端默认编辑器，实现代码高亮

    echo export EDITOR=vim >>/etc/profile.d/env.sh