uni-app横屏设置

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