当前位置:网站首页>applet preview pdf
applet preview pdf
2022-07-29 22:15:00 【~Memories】
1.添加jquery.qrcode.min.js和jquery-3.6.0.min.js
2.In the preview to be implementedpdfFeature page introduction==>import Pdfh5 from ‘pdfh5’
效果
页面代码
<!-- 富文本弹出框(阅读协议) Activate warranty -->
<van-dialog
use-slot
:title="dialog.title"
:class="dialog.countdown ? 'zb' : ''"
:show="dialog.show"
:show-cancel-button="dialog.showCancelButton && !formData[dialog.extField.name]"
:confirm-button-text="
dialog.confirmText + (dialog.countdown ? '(' + dialog.countdown + 's)' : '')
"
:cancel-button-text="dialog.cancelText"
@confirm="dialogConfirm"
@cancel="dialogCancel"
>
<view style="height: 50vh; overflow-y: auto; font-size: 15px; padding: 20rpx">
<div id="pdfFileShow" style="width: auto; height: auto"></div>
</view>
</van-dialog>
//实例化pdf- js代码
return {
pdfurl:'',
pdfh5:null,
// 弹窗(Such as reading the agreement)
dialog: {
show: false,
extField: {
// frontEndConfig:{
// confirmText:"同意",
// cancelText:"不同意",
// time:10, //How many seconds to read at least
// must:true, //Is it necessary to agree
// title:"",
// text:"",
// content:""
// }
}
}
}
this.pdfh5 = new Pdfh5($("#pdfFileShow"),{
zoomEnable: true, //是否允许pdf手势缩放
renderType: 'svg', //pdf渲染模式 svg canvas,
data: res.data
})
//监听完成事件
this.pdfh5.on("complete",function(status,msg,time){
console.log("状态:" + status + ",信息:" +
msg + ",耗时:" + time + "毫秒,总页数:" + this.totalNum)
});
//The method is called after the preview agrees
dialogConfirm() {
}
//A pop-up box cancels the operation
dialogCancel() {
if (this.dialog.timer) {
clearInterval(this.dialog.timer);
}
this.dialog.show = false;
}
style样式
.zb /deep/ .van-dialog__footer .van-dialog__button:last-child {
pointer-events: none;
}
边栏推荐
- 【AD】【持续更新ing】关于AD设计过程中一些小细节
- C# 窗体与子线程数据交互
- Huawei Enjoy 50 Pro evaluation: HarmonyOS blessing is smoother and safer
- Cooler Navigation helps you shop easily in shopping malls without confusion
- 02-SDRAM:自动刷新
- SQL教程之性能不仅仅是查询
- [ACTF2020 Freshman Competition]Exec 1
- 第3章业务功能开发(线索关联市场活动,插入数据并查询)
- 940. 不同的子序列 II
- ALBERT:A Lite BERT for Self-supervised Learning of Language Representations
猜你喜欢
小程序预览pdf
亚马逊登录参数metadata1,encryptedPwd逆向分析
Writing Elegant Kotlin Code: Talk About What I Think "Kotlinic"
[ACTF2020 新生赛]Exec 1
VR直播营销需求增加,数据模块为我们铺路
ALBERT:A Lite BERT for Self-supervised Learning of Language Representations
官宣!苏州吴江开发区上线电子劳动合同平台
阿里 P8 爆出的这份大厂面试指南,看完工资暴涨 30k!
人社部公布“数据库运行管理员”成新职业,OceanBase参与制定职业标准
全自动化机器学习建模!效果吊打初级炼丹师!
随机推荐
MySQL Data Query - Simple Query
ALBERT: A Lite BERT for Self-supervised Learning of Language Representations
酷客导航助你商场轻松购物,业务办理不迷茫
防火墙——SNAT和DNAT策略的原理及应用、防火墙规则的备份和还原
1. Promise usage in JS, 2. The concept and usage of closures, 3. The difference between the four methods and areas of object creation, 4. How to declare a class
leetcode122. Best Time to Buy and Sell Stock II 买卖股票的最佳时机 II(简单)
品牌广告投放平台的中台化应用与实践
太卷了,企业级的智慧物业系统,也完全开源....
qt中qstring合并字符串
什么是数据安全性?
SwiftUI 手势大全之可用的手势类型有哪些(教程含源码)
leetcode122. Best Time to Buy and Sell Stock II
容器网络硬核技术内幕 (小结-中)
第3章业务功能开发(线索关联市场活动,动态搜索)
大陆泽、宁晋泊蓄滞洪区防洪工程与安全建设项目启动实施
容器网络硬核技术内幕 (22) 安全与自由兼顾
MySQL - 设计游戏用户信息表
WPF 实现抽屉菜单
数组和List互转
最小jvm源码分析