vue-pdf-kit

A high-definition PDF viewer component for Vue 2 & Vue 3.

Features

• Ensures high-definition rendering of PDFs.
• Renders PDF documents in Vue applications, with support for both Vue 2 and Vue 3.
• Enables text selection and search within the rendered PDF documents.
• Supports rendering annotations within PDF.

Installation & Usage

npm install vue-pdf-kit

yarn add vue-pdf-kit

Usage

<script setup>
import VuePdfKit from 'vue-pdf-kit'
import 'vue-pdf-kit/dist/style.css'
</script>

<template>
  <VuePdfKit source="<url> | <base64>" enableTextLayer enableAnnotation />
</template>

If you want to use the component in Vue 2.6, you will install it as follows:

npm i @vue/composition-api

Props

Name	Type	Accepted values	Description
source	string `object	URL or Base64	Source of the document to display
scale	number	numbers	The ratio of canvas size to document size
enableTextLayer	boolean	true or false	whether the text layer should be enabled
enableAnnotation	boolean	true or false	Whether annotations should be enabled
password	string	Any string	Password for encrypted documents, if required
enableCMap	boolean	true or false	Enables Character Maps for accurate text rendering

Events

Name	Value	Description
progress	0-1 number	Represents the current progress or completion ratio of a task or operation, expressed as a percentage.
password	{callback:()=>{}}	Contains properties related to password handling.

License

MIT License. Please see LICENSE file for more information.