基于vue3的pdf预览组件

最近在预览pdf、word等文件时,基于vue3封装的预览组件。

首先将pdf或word等文件拆分成一张张图片。 

## 需要将pdf 拆解成一张张图片


### 安装方式
```
npm i pdf-preview-vue3
```

在 main.ts 文件中

import PDFPreview from "pdf-preview-vue3";
import 'pdf-preview-vue3/style.css'
createApp(App).use(PDFPreview).mount('#app')


组件内使用

组件参数

    // pdf的所有图片组数
    datas: {
        type: Array,
        default: () => [] as string[],
    },
    //定位预览
    startPage: {
        type: Number,
        default: 1,
    },
    //每页数量
    pageSize: { 
        type: Number,
        default: 10,
    }

    // 到底部触发的距离
    reachBottomDistance: {
        type: Number,
        default: 200,
    }  

查看效果

基于vue3的pdf预览组件_第1张图片 

 

在线链接 

 

你可能感兴趣的:(vue3,pdf预览,vue3插件,javascript,前端,vue.js)