vue2 pdfjs-2.8.335-dist pdf文件在线预览功能

news2024/10/5 19:09:56

1、首先先将 pdfjs-2.8.335-dist 文件夹从网上搜索下载,复制到public文件夹下.

2、在components下新建组件PdfViewer.vue文件

3、在el-upload 中调用 pdf-viewer 组件

4、在el-upload 中的 on-preview方法中加上对应的src路径

 internalPreview(file) {

//判断需要预览的地方加 props—pdfView
                if(this.pdfView){
                    let baseApi = process.env.VUE_APP_BASE_API;
                    let _path = file?.path;
                    this.src = `${baseApi}${_path}`
                }

}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1391176.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【Python】箱型图和热图绘制详解和示例

箱型图(Box Plot)和热图(Heatmap)是两种常用的数据可视化工具,它们各自有着不同的特点和用途。在写总结和文献时对数据的表达更加直观,本文对这两种图像的绘制进行详解和示例。 箱型图由一组数据的最小值、…

中国1981-2023年逐年每15天8km植被指数数据集

摘要 中国1981-2023年逐年每15天8km植被指数数据集来源于GIMMS NDVI数据,包括了1981年7月-2023年12月的长时间序列逐年每15天植被指数变化,格式为arcgis grid格式,投影为WGS84,其时间分辨率是15天,空间分辨…

【机组】算术逻辑运算单元实验的解密与实战

​🌈个人主页:Sarapines Programmer🔥 系列专栏:《机组 | 模块单元实验》⏰诗赋清音:云生高巅梦远游, 星光点缀碧海愁。 山川深邃情难晤, 剑气凌云志自修。 ​ 目录 🌺 一、 实验目的…

Java NIO (二)NIO Buffer类的重要方法

1 allocate()方法 在使用Buffer实例前,我们需要先获取Buffer子类的实例对象,并且分配内存空间。需要获取一个Buffer实例对象时,并不是使用子类的构造器来创建,而是调用子类的allocate()方法。 public class AllocateTest {static…

3.goLand基础语法

目录 概述语法for常量与变量数组切片 slice切片问题问题1问题2 Make 和 New结构体和指针结构体标签 结束 概述 从 java 转来学 go &#xff0c;在此记录&#xff0c;方便以后翻阅。 语法 for package mainimport "fmt"func main() {for i : 0; i < 3; i {fmt.…

关于java的封装

关于java的封装 我们在前面的文章中&#xff0c;了解到了类和对象的知识&#xff0c;以及做了创建对象的时候对内存的分析&#xff0c;我们本篇文章来了解一下面向对象的三大基本特征之一&#xff0c;封装&#x1f600;。 一、初识封装 封装就好比&#xff0c;我们把一些物品…

如何在 Python3 中使用变量

介绍 变量是一个重要的编程概念&#xff0c;值得掌握。它们本质上是在程序中用于表示值的符号。 本教程将涵盖一些变量基础知识&#xff0c;以及如何在您创建的 Python 3 程序中最好地使用它们。 理解变量 从技术角度来说&#xff0c;变量是将存储位置分配给与符号名称或标…

YOLOv8改进 | 主干篇 | 低照度增强网络PE-YOLO改进主干(改进暗光条件下的物体检测模型)

一、本文介绍 本文给大家带来的改进机制是低照度图像增强网络PE-YOLO中的PENet,PENet通过拉普拉斯金字塔将图像分解成多个分辨率的组件,增强图像细节和低频信息。它包括一个细节处理模块(DPM),用于通过上下文分支和边缘分支增强图像细节,以及一个低频增强滤波器(LEF),…

<软考高项备考>《论文专题 - 71 风险管理(3)》

3 过程2-识别风险 3.1 问题 4W1H过程做什么是识别单个项目风险以及整体项目风险的来源&#xff0c;并记录风险特征的过程。作用:1、记录现有的单个项目风险&#xff0c;以及整体项目风险的来源:2、汇总相关信息&#xff0c;以便项目团队能够恰当地应对已识别的风险。为什么做…

重温经典struts1之DispatchAction完成一个Action中编写多个方法接收页面的增删改查请求

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 前言 之前我们学习的Action类中&#xff0c;编写一个方法&#xff0c;重写父类的execute方法&#xff0c;接收页面发来的请求&#xff0c;而且&#xff0c;一个action中只能…

Jetson AGX Orin安装archiconda、Pytorch

想在Jetson AGX Orin创建一个虚拟环境&#xff0c;然后安装pytorch&#xff0c;过程中遇到了很多的坑&#xff0c;这篇文章主要用于记录过程~因为Orin本身是Arm架构&#xff0c;X86架构可以装Anaconda&#xff0c;对于ARM要装archiconda。 1.安装archiconda 1.1确定操作系统架…

FlinkSQL【分组聚合-多维分析-性能调优】应用实例分析

FlinkSQL处理如下实时数据需求&#xff1a; 实时聚合不同 类型/账号/发布时间 的各个指标数据&#xff0c;比如&#xff1a;初始化/初始化后删除/初始化后取消/推送/成功/失败 的指标数据。要求实时产出指标数据&#xff0c;数据源是mysql cdc binlog数据。 代码实例 --SET t…

【GCC】6 接收端实现:周期构造RTCP反馈包

基于m98代码。GCC涉及的代码,可能位于:webrtc/modules/remote_bitrate_estimator webrtc/modules/congestion_controller webrtc/modules/rtp_rtcp/source/rtcp_packet/transport_feedback.cc webrtc 之 RemoteEstimatorProxy 对 remote_bitrate_estimator 的 RemoteEstimato…

java注释详解

1、Java 中的注释详解 概括&#xff1a;注释是增加一些说明&#xff0c;在编译后&#xff0c;注释会被抹掉&#xff0c;不起任何租用&#xff0c;只在书写代码的时候&#xff0c;对代码进行的一个说明 不管是那种编程语言&#xff0c; 代码的注释都是必备的语法功能&#xff…

初识 Elasticsearch 应用知识,一文读懂 Elasticsearch 知识文集(5)

&#x1f3c6;作者简介&#xff0c;普修罗双战士&#xff0c;一直追求不断学习和成长&#xff0c;在技术的道路上持续探索和实践。 &#x1f3c6;多年互联网行业从业经验&#xff0c;历任核心研发工程师&#xff0c;项目技术负责人。 &#x1f389;欢迎 &#x1f44d;点赞✍评论…

GitLab Runner 实现项目 CI/CD 发布

Gitlab Runner简介 Gitlab实现CICD的方式有很多&#xff0c;比如通过Jenkins&#xff0c;通过Gitlab Runner等&#xff0c;今天主要介绍后者。Gitlab在安装的时候&#xff0c;就默认包含了Gitlab CI的能力&#xff0c;但是该能力只是用于协调作业&#xff0c;并不能真的去执行…

Vulnhub-tr0ll-1

一、信息收集 端口收集 PORT STATE SERVICE VERSION 21/tcp open ftp vsftpd 3.0.2 | ftp-anon: Anonymous FTP login allowed (FTP code 230) |_-rwxrwxrwx 1 1000 0 8068 Aug 09 2014 lol.pcap [NSE: writeable] | ftp-syst: | STAT: | FTP …

STM32F103标准外设库——GPIO 输入、输出 (五)

个人名片&#xff1a; &#x1f981;作者简介&#xff1a;一名喜欢分享和记录学习的在校大学生 &#x1f42f;个人主页&#xff1a;妄北y &#x1f427;个人QQ&#xff1a;2061314755 &#x1f43b;个人邮箱&#xff1a;2061314755qq.com &#x1f989;个人WeChat&#xff1a;V…

Qt第二周周二作业

代码&#xff1a; widget.h #ifndef WIDGET_H #define WIDGET_H#include <QWidget>QT_BEGIN_NAMESPACE namespace Ui { class Widget; } QT_END_NAMESPACEclass Widget : public QWidget {Q_OBJECTpublic:Widget(QWidget *parent nullptr);~Widget();void paintEvent(…

苹果MAC怎么清理内存?苹果MAC清理内存的方法

很多使用苹果电脑的用户都喜欢在同时运行多个软件&#xff0c;不过这样会导致在运行一些大型软件的时候出现不必要的卡顿现象&#xff0c;这时候我们就可以去清理下内存&#xff0c;不过很多人可能并不知道正确的清内存方式&#xff0c;下面就和小编一起来看看吧。 苹果MAC清理…