uniapp去掉手机状态栏 全屏展示

app.vue

onShow: function() {

console.log('App Show')

this.$nextTick(() => {

if (typeof plus !== 'undefined') {

// 隐藏状态栏(沉浸式)

plus.navigator.setFullscreen(true)

// 尝试隐藏底部系统导航栏(部分机型有效)

plus.navigator.hideSystemNavigation()

}

})

复制代码
<style lang="scss">
	/* 注意要写在第一行,同时给style标签加入lang="scss"属性 */
	@import "uview-plus/index.scss";
</style>
<script>
import {  stopHeartbeat,startHeartbeat } from "./request/heartbeat";

	export default {
		onLaunch: function() {
    console.log('App Launch')
    if (typeof plus !== 'undefined') {
      plus.screen.lockOrientation('landscape-primary')
    } else {
      document.addEventListener('plusready', () => {
        plus.screen.lockOrientation('landscape-primary')
      })
    }
  },
		onShow: function() {
			console.log('App Show')
			this.$nextTick(() => {
      if (typeof plus !== 'undefined') {
        // 隐藏状态栏(沉浸式)
        plus.navigator.setFullscreen(true)

        // 尝试隐藏底部系统导航栏(部分机型有效)
        plus.navigator.hideSystemNavigation()
      }
    })
		},
		onHide: function() {
			console.log('App Hide')
		},
		// App 关闭或页面退出时停止心跳
		onUnload() {
  		  stopHeartbeat()
  }
	}
</script>

<style lang="scss">
	@import "/static/iconfont/iconfont.css";
	/*每个页面公共css */
	@import '@/uni_modules/uni-scss/index.scss';
	/* #ifndef APP-NVUE */
	@import '@/static/customicons.css';
	// 设置整个项目的背景色
	page {
		background-color: #f5f5f5;
	}

	/* #endif */
	.example-info {
		font-size: 14px;
		color: #333;
		padding: 10px;
	}
</style>

manifest.json里面配置

复制代码
{
  "app-plus": {
    "statusbar": {
      "immersed": true,
      "style": "dark",
      "background": "#000000"
    }
  }
}

最后就可以全屏了#

相关推荐
逝水无殇1 小时前
C# 异常处理详解
开发语言·后端·c#
玖玥拾2 小时前
C# 语言进阶(十五)C# 游戏服务端 MySQL 数据库
服务器·开发语言·网络·数据库·mysql·c#
铅笔侠_小龙虾3 小时前
Rust 学习目录
开发语言·学习·rust
云泽8083 小时前
从零吃透 C++ 异常:抛出捕获、栈展开、异常重抛与编码规范详解
开发语言·c++·代码规范
灯澜忆梦3 小时前
GO---可见性规则
开发语言·golang
逝水无殇4 小时前
C# 文件的输入与输出详解
开发语言·数据库·后端·c#
shuaijie05184 小时前
强制修改调用接口的api地址。
javascript·vue.js·ecmascript
JerrySir4 小时前
恶意 npm 包只活了 17 分钟:技术面试里,为什么“升级依赖”还不算止血?
javascript·安全
白帽小阳4 小时前
2026前端面试题!(附答案及解析)
javascript·网络·python·安全·web安全·网络安全·护网行动
这是个栗子4 小时前
前端开发中的常用工具函数(八)
开发语言·前端·javascript