uniapp中设置横屏竖屏

在uniapp中，可以通过以下步骤来设置横屏或竖屏：

1. 在manifest.json文件中设置屏幕方向，如下所示：

"plus": {
  "orientation": "portrait"
},

其中，orientation可以设置为portrait（竖屏）或landscape（横屏）。

2. 在App.vue中设置样式，如下所示：

<style>
  .page {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
  }
  .page.landscape {
    transform: rotate(90deg);
    transform-origin: 50% 50%;
    width: 100vh;
    height: 100vw;
  }
</style>

其中，.page是页面的样式，可以根据实际情况进行修改。.page.landscape是横屏状态下的样式，使用transform属性进行旋转，并设置宽高和transform-origin属性。

3. 在需要横屏的页面中，使用以下代码来切换样式：

export default {
  mounted() {
    this.$nextTick(() => {
      if (window.plus) {
        // 横屏
        plus.screen.lockOrientation('landscape');
        document.documentElement.classList.add('landscape');
      }
    });
  },
  beforeDestroy() {
    if (window.plus) {
      // 竖屏
      plus.screen.unlockOrientation();
      document.documentElement.classList.remove('landscape');
    }
  }
}

其中，mounted和beforeDestroy是页面生命周期钩子函数，用于在页面加载和销毁时进行操作。plus.screen.lockOrientation('landscape')用于锁定屏幕方向，document.documentElement.classList.add('landscape')用于切换样式。同理，plus.screen.unlockOrientation()和document.documentElement.classList.remove('landscape')用于解锁屏幕方向和恢复样式。