# vant-preview-pdf组件使用说明

## 安装

```bash
npm install -S vant-preview-pdf
```

## 准备工作

安装后找到如下文件夹

> node_modules
>
> > vant-preview-pdf
> >
> > > cmaps

将cmaps文件夹上传服务器，使其可以使用链接访问

可放置在public文件夹下与index.html同级，使用项目链接访问该文件

## 引入

```js
const vantPreviewPdf = require("vant-preview-pdf") 
Vue.use(vantPreviewPdf)
```

## 使用

```html
<vant-preview-pdf cMapUrl="http://www.xiaobusoft.com/cmaps/" url="http://www.xiaobusoft.com/vant-preview-pdf.pdf" />
```

### 可配置参数

|      字段      |                             说明                             |   类型   |                         默认值                         |
| :------------: | :----------------------------------------------------------: | :------: | :----------------------------------------------------: |
|      eid       |                          canvas的Id                          |  String  |                         pdfjs                          |
|   base64Pdf    | pdf base64数据流, 有无data:application/pdf;base64,  开头均可 |  String  |                           “”                           |
|      url       |   pdf 文件路径  base64Pdf优先级高于url 确保base64Pdf没配置   |  String  |                           “”                           |
|   limitHttp    |            pdf 限制url是否有http，结合url入参使用            | Boolean  |                          true                          |
| imagePreviewFn |                    vant的imagePreview方法                    | Function |                           空                           |
|   autoScroll   |             图片预览关闭，自动滚动到对于索引位置             | Boolean  |                          true                          |
|    cMapUrl     |           cMaps 文件夹访问地址 地址  记得 “/” 结尾           |  String  | https://cdn.jsdelivr.net/npm/pdfjs-dist@2.3.200/cmaps/ |

## 事件

|        方法         |                 描述                  |
| :-----------------: | :-----------------------------------: |
| savePreviewImageFn  |          向外传递pdf预览图片          |
| previewImageOnClose |      关闭预览，抛出对应位置图片       |
|   renderPdfError    |          pdf渲染失败异常抛出          |
|  renderPdfFinally   | pdf渲染完成事件，可在此时关闭加载动画 |