admin管理员组文章数量:1545236
<template>
<view style="width: 100%;height: 100vh;background-color: #fff;" v-if="showTis">
<view style="width: 100%;display: flex;justify-content: flex-end;margin-bottom: 30rpx;">
<image style="width: 50%;" src="/static/newImg/tips1.png" mode=""></image>
</view>
<view style=" width: 100%;position: absolute; left: 50%; margin-left: -25%;">
<view style="">
<view style="display: flex;align-items: center;">
<view style="margin: 0 20rpx 0 0;padding:8rpx 16rpx;background-color: #2d8cf0;color: #fff;border-radius: 55%;">1</view>
<view style="font-size: 24rpx;">点击右上角的</view>
<view style="margin: 0 30rpx; background-color: #2d8cf0;border-radius: 10rpx;width: 55rpx;height: 50rpx;display: flex;justify-content: center;align-items: center;">
<image style=" width: 30rpx;height: 30rpx;" src="../../static/newImg/tips3.png" mode=""></image>
</view>
<view style="font-size: 24rpx;">按钮</view>
</view>
</view>
<view style="">
<view style="display: flex;align-items: center;margin-top: 30rpx;">
<view style="margin: 0 20rpx 0 0;padding:8rpx 16rpx;background-color: #2d8cf0;color: #fff;border-radius: 50%;">2</view>
<view style="font-size: 24rpx;">选择</view>
<view style="margin: 0 30rpx; background-color: #2d8cf0;border-radius: 10rpx;width:250rpx ;height: 50rpx;display: flex;justify-content: center;align-items: center;">
<image style=" width: 30rpx;height: 30rpx;margin-right: 20rpx;" src="../../static/newImg/tips2.png" mode=""></image>
<view style="color: #fff;font-size: 24rpx;">在浏览器中打开</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
path: '',
showTis: null
}
},
onLoad(opt) {
this.path = opt.path
this.download()
},
methods: {
download() {
let is_weixin = this.checkUrl() //调用checkUrl 得到返回结果
if (is_weixin) {
this.showTis = true //可以理解为this.display绑定了 引导图img的display属性,当前是微信浏览器，展示引导图
} else {
this.showTis = false //当前为其他浏览器 ，隐藏引导图
window.location.href = this.path //讲之前存储的文件地址，赋值给当前 地址栏，即可预览或者下载文件了
}
},
checkUrl() {
let ua = window.navigator.userAgent.toLowerCase();
if (ua.match(/MicroMessenger/i) == 'micromessenger') {
return true; // '微信浏览器'
} else {
return false; // 其他浏览器
}
}
}
}
</script>
<style>
</style>新建downreport页面
点击后携带下载URL 跳转至downreport并接收URL
版权声明：本文标题：uniapp微信公众号（H5）引导打开浏览器下载文件 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：https://m.elefans.com/dongtai/1727156778a1099595.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论