# pdfjs-dist相关

当前此版本为pdf2.0.943，为了兼容国产浏览器，请勿随意升级版本

## 1.注意事项

### 如果需要更新pdfjs-dist，需更新以下文件

1.将pdfjs-dist放置public目录下
2.将pdfjs-dist/build/pdf.js和pdfjs-dist/build/pdf.worker.js复制到zys-ui/public目录下

#### 如需更新PdfViewer,目录位于zys-ui/src/components/PdfViewer

### 2.使用pdfjs-dist插件步骤

注意：已将pdfjs-dist的引用封装至PdfViewer组件，直接使用PdfViewer组件即可，组件位置src/components/PdfViewer/index.vue

使用PdfViewer示例代码如下：

```vue
<template>
    <div>
            <PdfViewer
            :url="url"
            v-if="url"
            ref="pdfRef"
            @copy="copyText"
            @addNote="addNote"
            @ready="ready"
        />
    </div>
</template>
<script>
import PdfViewer from "@/components/PdfViewer/index.vue";
export default{
components: {
    PdfViewer,
},
data(){
    return {
        pdfAnnotInstance: null,
        url: "your pdf url",
    },
    methods:{
        // pdf跳转页面
        pdfSwitchPage(page) {
            this.pdfAnnotInstance.switchPage(page);
        },
        // 复制文本
        copyText(value) {
            console.log("copyText", value);
        },
        // 添加笔记
        addNote(value) {
            console.log("addNote", value);
        },
        // pdf初始化钩子函数
        ready(value) {
            this.pdfAnnotInstance = value;
            this.renderNote();
        },
    }
}
}
</script>

```
