更新记录

1.0.2(2024-09-18)

  • 修复本地路径可能的错误.

1.0.1(2024-09-18)

  • 修复本地路径可能的错误.

1.0.0(2024-09-14)

发布第一版本,双端支持打印pdf文件及预览操作pdf文件,嵌入视频预览pdf,方便定义界面。

查看更多

平台兼容性

Vue2 Vue3
×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 4.0,Android:5.0,iOS:9,HarmonyNext:不确定 × × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
× × × × × × × × ×

x-pdf-u

开发文档

本插件会让你的安卓应用增加大约3.7mb体积 本插件会让你的IOS应用增加大约4kb体积

使用原生底层api打印和预览,没有第三方框架比如腾讯x5浏览器套壳或者webKit.纯 原生实现,为你的应用大小减负

接受打印定制功能:比如图片打印,文档打印,小票,票据等定制预览打印

此插件包含打印及预览一体,TMUI4.0VIP 8折优惠(加密没有优惠源码才有)。

tmui4.0

功能说明

  1. 内嵌式页面预览pdf文件,方便你定义预览pdf界面。
  2. 支持打印预览,预览与打印结果一致。
  3. 安卓或者手机会弹出打印预览界面,自行在手机上选择无线打印机或者隔空AirWifi打印机

兼容性

IOS IPAD macOs Andriod WEB
11+ 11+ 10.4+ 4.4+ -

函数方法

请通过let ele = this.$refs["pdf"] as XPdfUElement来获取ele组件实例。

方法名称 参数 返回参数 说明
getCurrent - page:number 返回当前预览的页码
getPageCount - pageCount:number 返回文件的总页数,请务必文档加载onInit后调用
jumpTo page:number - 跳转至指定页码,从0开始
render url:string - 手动加载并渲染页面,url可以是网络地址或者本地pdf文档地址
print - - 打印文档,请务必要Oninit后让文档显示 成功后才可以调用打印功能。

组件事件

事件名称 参数 说明
onInit evt : Map<string,number> 一个文档加载成功后触发,每变更或者重新渲染文档,成功后都会触发,{page: 0, pageCount: 32},这里的page始终为0
pageChange evt : Map<string,number> 用户滑动pdf文档或者首次加载成功,都会触发页面变化 事件{page: 7, pageCount: 32}

使用示例

如果是安卓请务必打自定义基座

如果是ios:你在mac环境下配置好了环境无需打包本地编译,如果win开发ios需要打包基座。


// 在你的页面中引入pdf组件,组件遵守uni_modules规则,无需导入
<x-pdf-u ref='pdf' @pageChange="change" :url="url" style="width:100%;height:450px;"></x-pdf-u>

// 你的uts代码
<script>

    export default {
        data() {
            return {
                url:''
            }
        },
        onLoad() {
        },
        methods: {
            // 打印pdf
            sharePdf(){
                let ele = this.$refs["pdf"] as XPdfUElement
                ele.print()
            },
            // 用户在滑动pdf文件,页面变化时触发
            change(evt : UTSJSONObject){
                // {page: 7, pageCount: 32}
                console.log(evt)
            },
            // 跳转到指定页面
            pageTo(){
                let ele = this.$refs["pdf"] as XPdfUElement
                ele.jumpTo(2)
            },
            // 下载远程pdf文件给组件打印,也可以不本地下载,直接提供url远程链接,框架内部自行下载(不推荐)
            loadUrl(){
                let _this = this;
                uni.showLoading({title:"..."})
                uni.downloadFile({
                    url:"https://www.espressif.com/sites/default/files/documentation/0a-esp8266ex_datasheet_cn.pdf",
                    success(evt) {
                        uni.hideLoading()
                        let decodedPath = evt.tempFilePath
                        _this.url = decodedPath;
                    },
                    fail() {
                        uni.hideLoading()
                    }
                })

            }
        }
    }
<\/script>

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

暂无用户评论。

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问