uniapp 橫豎屏設(shè)置

整個(gè)項(xiàng)目的橫豎屏設(shè)置

App.vue

<script>
  export default {
    onLaunch: function() {
      console.log('App Launch')
        // 鎖定橫屏
        // plus.screen.lockOrientation("landscape-primary");  
        // 鎖定豎屏   
        plus.screen.lockOrientation("portrait-primary");
      },
      onShow: function() {
        console.log('App Show')  
      },
      onHide: function() {
        console.log('App Hide')
      }
}
</script>

<style>
    /*每個(gè)頁(yè)面公共css */
</style>

單個(gè)頁(yè)面設(shè)置橫屏

index.vue

onLoad(option) {
  setTimeout(function(){
    plus.screen.lockOrientation('landscape-primary');
  },10)
}
// 監(jiān)聽頁(yè)面返回
onBackPress(e) {
  // plus.screen.unlockOrientation(); //解除屏幕方向的鎖定,但是不一定是豎屏;
  uni.redirectTo({
    url: 'login'
  });
  plus.screen.lockOrientation('portrait'); //鎖死屏幕方向?yàn)樨Q屏
  return true;
},

注意:
1.定時(shí)器一定要寫,不然不生效。
2.必須解除橫屏或者設(shè)置豎屏。

問題:

一、plus is not defined
這個(gè)報(bào)錯(cuò)是說明要運(yùn)行在手機(jī)app上才能找到plus這個(gè)方法,因?yàn)閜lus是app才有的方法
二、界面混亂
由于橫屏后使用rpx會(huì)導(dǎo)致界面混亂。解決:
1.使用px,但是px不會(huì)適配。有可能在不同的手機(jī)上展示不同
2.在這個(gè)頁(yè)面單獨(dú)使用rem,把rem設(shè)置成1/750屏幕大小

大家有任何問題都可以指出,歡迎評(píng)論!
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容