更新记录

0.1.1（2025-08-24）

• feat: 兼容鸿蒙Next

0.1.0（2025-05-13）

• fix: 修复无法使用unifile://路径的问题

0.0.9（2025-03-17）

• chore: 更新文档

平台兼容性

uni-app x(4.76)

lime-pdf PDF预览组件

UTS原生PDF预览器，支持本地和网络PDF文件预览，提供页面跳转、滑动切换等功能，兼容uniappx(安卓、iOS、鸿蒙Next)。组件使用原生能力渲染PDF文件，性能优异，支持密码保护的PDF文件，并提供丰富的事件回调。

插件依赖：需要在自定义基座中使用

文档链接

📚 组件详细文档请访问以下站点：

• PDF预览组件文档 - 站点1
• PDF预览组件文档 - 站点2
• PDF预览组件文档 - 站点3

安装方法

1. 在uni-app插件市场中搜索并导入lime-pdf
2. 导入后可能需要重新编译项目
3. 需要在自定义基座中使用
4. 安卓本地运行还需配置 gradle
5. 在页面中使用l-pdf组件
6. 鸿蒙Next需要真机并且需要源码，所以谨慎购买

代码演示

基础使用

通过url可以设置pdf的路径，支持网络或本地。

<l-pdf 
    ref="pdfRef"
    url="/static/shareSDK.pdf"  
    @load="load"
    @fail="fail"
    @pageChanged="pageChanged"
    style="height:500px;width: 100%;">
</l-pdf>
<button @click="onClick">跳转指指定页面</button>

// 组合式
const pdfRef = ref<LPdfComponentPublicInstance|null>(null)

const load = (info: UTSJSONObject)=>{
    // INFO 包含 页数，作者，标题，目录等
    console.log('info', info)
}

const fail = (err: UTSJSONObject)=>{
    // 发生错误时
    console.log('err', err)
}
const pageChanged = (info: UTSJSONObject)=> {
    // 切换页面时 
    console.log('pageChanged', info)
}
const onClick = ()=> {
    // 跳转到指定页面
    pdfRef.value?.jumpTo(3)
}

Render

<l-pdf 
    ref="pdfRef"
    @load="load"
    @fail="fail"
    @pageChanged="pageChanged"
    style="height:500px;width: 100%;">
</l-pdf>
<button @click="render">render</button>

// 选项式
export default {
    data() {
        return {

        }
    },
    methods: {
        load(info: UTSJSONObject) {
            // INFO 包含 页数，作者，标题，目录等
            console.log('info', info)
        },
        fail(err: UTSJSONObject) {
            // 发生错误时
            console.log('err', err)
        },
        pageChanged(info: UTSJSONObject) {
            // 切换页面时
            console.log('pageChanged', info)
        },
        render() {
            // 调用渲染函数
            (this.$refs['pdfRef'] as LPdfComponentPublicInstance | null)?.render?.(
                "/static/shareSDK.pdf", // pdf 路径
                0, // 默认页面 
                false, //是否允许水平滑动切换页面，false（垂直滑动）
                'password'//如果pdf有密码可选填
            )
        }
    }
}

插件标签说明

API文档

Props 属性说明

Events 事件

方法 API

通过组件实例调用方法：

// uniapp
const pdfRef = this.$refs.pdfRef

// uniappx (TypeScript)
const pdfRef = this.$refs["pdfRef"] as LPdfComponentPublicInstance

使用注意事项

1. 组件需要在自定义基座中使用，普通编译环境可能无法正常运行
2. 安卓平台需要额外配置gradle，详见安装方法
3. 组件高度需要通过style属性设置，否则可能无法正常显示
4. 对于密码保护的PDF文件，需要提供正确的密码才能正常显示
5. 页面索引从0开始计算，例如第一页的索引为0

TypeScript 类型支持

在TypeScript项目中使用时，可以导入以下类型：

// 组件实例类型
import type { LPdfComponentPublicInstance } from '@/uni_modules/lime-pdf'

// 事件回调参数类型
interface PdfLoadInfo {
  page: number;
  pageCount: number;
  category: string[];
  meta: Record<string, string>;
}

interface PdfPageChangedInfo {
  page: number;
  pageCount: number;
}

interface PdfFailError {
  errMsg: string;
}

支持与赞赏

如果你觉得本插件解决了你的问题，可以考虑支持作者：

支付宝赞助	微信赞助