vue-preview-pdf
VueTextExpand
Vue组件,用于预览PDF文件。
安装
$ npm i -S @cleexiaohui/vue-preview-pdf
使用
import Vue from 'vue'
import VuePreviewPDF from '@cleexiaohui/vue-preview-pdf'
Vue.use(VuePreviewPDF)
new Vue({
data: {
url: 'path/to/your/file.pdf',
},
})
<vue-preview-pdf :url="url" />
自定义Loading
<vue-preview-pdf :url="url" customLoading>
<section slot="loading" slot-scope="scope">
{{ scope.loading ? '加载中...' : '加载完成' }}
</section>
</vue-preview-pdf>
自定义Pager
<vue-preview-pdf :url="url" customPager>
<section slot="pager" slot-scope="scope" >
<span>当前在第{{scope.current}}页</span>
<span>共{{scope.total}}页</span>
</section>
</vue-preview-pdf>
属性
参数 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
url | PDF下载链接 | string | —— | —— |
width | 容器宽度 | string | —— | 100% |
height | 容器高度 | string | —— | 100% |
background | 容器背景色 | string | —— | #fff |
custonLoading | 使用自定义Loading | boolean | —— | false |
customPager | 使用自定义Pager | boolean | —— | false |
disabledDownload | 禁止用户下载 | boolean | —— | false |