1.官网全局设置

https://uniapp.dcloud.io/collocation/pages?id=globalstyle

"globalStyle": {
	"pageOrientation": "auto"
}

2.某个页面横竖屏设置

在manifest.json中添加配置:

"orientation" : [
	// 竖屏正方向
	"portrait-primary",
	// 竖屏反方向
	"portrait-secondary",
	// 横屏正方向
	"landscape-primary",
	// 横屏反方向
	"landscape-secondary",
	//自然方向
	"default"
]

3.需要横竖屏切换的页面

onLoad(){
	// #ifdef APP-PLUS
	   plus.screen.lockOrientation('default'); 
	// #endif

},
onUnload(){
	// #ifdef APP-PLUS
	   plus.screen.lockOrientation('portrait-primary'); 
	// #endif
}

4.不需要横竖屏切换的页面

onLoad(){
	// #ifdef APP-PLUS
	   plus.screen.lockOrientation('portrait-primary'); 
	// #endif

},
onUnload(){
	// #ifdef APP-PLUS
	   plus.screen.lockOrientation('portrait-primary'); 
	// #endif
}

5.强制横屏

mounted() {
	// plus.screen.lockOrientation( 'landscape-secondary');
	plus.screen.lockOrientation( 'landscape-primary');
}

Screen.lockOrientation()用法:
https://developer.mozilla.org/zh-CN/docs/Web/API/Screen/lockOrientation

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐