1.微信小程序在微信开发者工具中,手机预览,页面空白问题
把unpackage / mp-weixin / app.json 这个文件夹最这部分删除掉
"usingComponents": {
"rwj-tabbar": "/components/rwj-tabbar",
"hx-navbar": "/components/hx-navbar/hx-navbar"
}
2.微信小程序pdf预览
ios使用webview,直接预览后下载
安卓不能直接预览,需先下载,后打开实现预览
<template>
<view class="page">
<web-view :src="src" v-if="iOS"></web-view>
</view>
</template>
<script>
export default {
data() {
return {
pdf_url: 'https://xxx.xxx.xxx', //url前缀
src: '', // PDF地址
iOS: true,
}
},
onLoad: function (option) {
console.log('00000', option)
// 上一个页面传过来的url参数,与前缀拼接
this.src = this.pdf_url + option.src
uni.setNavigationBarTitle({
title: option.title,
})
},
onShow() {
// 判断操作系统
let src = this.src;
uni.showLoading({
title: '加载中......',
mask: true
});
uni.getSystemInfo({
success: res => {
if (res.system.includes('iOS')) {
uni.hideLoading();
this.iOS = true
// iOS 可直接查看
} else {
this.iOS = false
// Android 需要下载后再打开
uni.downloadFile({
url: src,
success: res => {
const path = res.tempFilePath
uni.openDocument({
filePath: path,
fileType: 'pdf',
success: res => {
uni.hideLoading();
uni.navigateBack({
delta: 1,
})
},
fail: err => {
uni.hideLoading();
uni.showToast({
title: '打开文件失败:' + JSON.stringify(err),
icon: 'none',
duration: 2000,
})
},
})
},
fail: err => {
uni.hideLoading();
console.log(JSON.stringify(err))
uni.showToast({
title: '下载文件失败:' + JSON.stringify(err),
icon: 'none',
duration: 2000,
})
},
})
}
},
})
},
}
</script>
3.微信小程序域名添加:
登录https://mp.weixin.qq.com/——>开发——>开发管理——>开发设置——>服务器域名