uniapp APP项目启动页面全屏显示去除导航栏和下巴
uniapp APP项目启动页面全屏显示去除导航栏和下巴<template><view><!-- 启动图 --><view class="start-item" ><image :src="startImg" mode="" class="pic" @click="jump(startUrl)"></image></vi
·
uniapp APP项目启动页面全屏显示去除导航栏和下巴
<template>
<view>
<!-- 启动图 -->
<view class="start-item" >
<image :src="startImg" mode="" class="pic" @click="jump(startUrl)"></image>
</view>
</view>
</template>
<script>
export default {
data() {
return {
startImg:'',//启动图图片
startUrl:'',//启动图跳转链接
}
},
onLoad(param) {
const that = this;
// 获取启动图
that.getStartImg();
//3秒后跳转至首页
setTimeout(()=>{
that.switchTab('/pages/index/index')
},3000)
},
//设置页面全屏
onShow() {
// #ifdef APP-PLUS
plus.navigator.setFullscreen(true);//隐藏手机顶部状态栏
plus.navigator.hideSystemNavigation();//隐藏手机底部导航按键
// #endif
},
//监听页面卸载事件 如果不加这句,会导致跳转到别的页面后也是全屏
onUnload() {
// #ifdef APP-PLUS
plus.navigator.setFullscreen(false);//显示手机顶部状态栏
plus.navigator.showSystemNavigation();//显示手机底部导航按键
// #endif
},
methods: {
// 获取启动图
getStartImg() {
const that = this;
that.$http.get('api/index_start').then(res => {
console.log("启动图", res);
if (res.status_code == 200) {
that.startImg = res.data.img;
that.startUrl = res.data.img_url;
} else {
that.$tool.toast(res.message)
}
})
},
//跳转链接
jump(url) {
console.log(url);
// #ifdef APP-PLUS
// 判断平台
if (plus.os.name == 'Android') {
plus.runtime.openURL(encodeURI(url),
function(res) {
console.log('安卓手机点击了跳转',res)
},
)
} else if (plus.os.name == 'iOS') {
plus.runtime.openURL(encodeURI(url),
function(res) {
console.log('苹果手机点击了跳转',res)
}
)
}
// #endif
// #ifdef H5
window.location.href = url;
// #endif
},
}
}
</script>
<style lang="scss">
// 启动图
.start-item{
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 10000;
background-color: #FFFFFF;
}
</style>
更多推荐
已为社区贡献11条内容
所有评论(0)