# yuPdf pdf预览组件
pdf文件预览组件，支持在线pdf预览等，纯h5实现，不依赖原生
# 效果预览
依赖插件安装：
yarn add pdfh5
yarn add canvas@2.8.0 --ignore-scripts
yarn add dommatrix
yarn add web-streams-polyfill
<template>
<div style="height: 100%;">
<yu-pdf :url="pdfUrl" :height="'800px'" :width="'100%'"></yu-pdf>
</div>
</template>
<script>
import yuPdf from '@/components/yu-pdf/index.vue'
export default {
components: {
yuPdf
},
data() {
return {
pdfUrl: 'http://210.12.198.141:30527/cmis-contract/api/handlerfile/reviewPdfWithWaterMark?contNo=BSNPLANID20240422000713'
};
},
methods: {
}
};
</script>
# Attributes
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| pdfUrl | pdf文件地址，支持在线与本地 | string | - | - |
| height | pdf展示窗口高度 | string（100%/200px） | - | - |
| width | pdf展示窗口宽度 | string（100%/200px） | - | - |