Minimal PDF Viewer For Vue 3

Install & Download:

# NPM
$ npm i pdf-vue3

Description:

A lightweight yet fully configurable PDF viewer component for Vue 3 applications.

How to use it:

1. Install and import the PDF component into your Vue project.

import PDF from "pdf-vue3";

2. Add the PDF component to the app and specify the path to the PDF file.

<template>
  <PDF src="/demo.pdf" />
  <!-- <PDF :src="BASE64" /> -->
  <!-- <PDF :src="Uint8Array" /> -->
</template>

3. Available component props to customize the PDF viewer.

/**
 * pdf url | Uint8Array | BASE64
 */
src: string | Uint8Array;
httpHeaders?: Record<string, any>;
withCredentials?: boolean;
password?: string;
useSystemFonts?: boolean;
stopAtErrors?: boolean;
disableFontFace?: boolean;
disableRange?: boolean;
disableStream?: boolean;
disableAutoFetch?: boolean;
// --custom--
showProgress?: boolean;
progressColor?: string;
showPageTooltip?: boolean;
showBackToTopBtn?: boolean;
scrollThreshold?: number;
pdfWidth?: string;
rowGap?: number;
page?: number;
cMapUrl?: string;

Preview:

Minimal PDF Viewer For Vue 3

Changelog:

v1.0.12 (02/04/2024)

  • export reload method and props add cmapsUrl

v1.0.11 (11/20/2023)

  • add on-page-change
Tags:

Add Comment