uni-app cover-view真机上video非全屏时不显示，全屏才显示

在 uni-app 中使用 cover-view 组件时，确实存在一些问题，尤其是在 video 组件非全屏状态下，cover-view 可能无法正常显示。这是因为在非全屏状态下，video 组件的层级较高，cover-view 可能会被遮挡或无法渲染。

解决方案

1. 使用 cover-view 和 cover-image 的嵌套： 确保 cover-view 和 cover-image 是 video 组件的直接子组件，并且尽量使用 cover-view 包裹 cover-image。

   <template>
     <view>
       <video id="myVideo" controls>
         <cover-view class="controls">
           <cover-image src="/static/play.png" @tap="play"></cover-image>
         </cover-view>
       </video>
     </view>
   </template>
   

2. 使用 video 的 controls 属性： 如果不需要自定义控件，可以直接使用 video 组件的 controls 属性，这样可以避免 cover-view 的显示问题。

   <template>
     <view>
       <video id="myVideo" controls></video>
     </view>
   </template>
   

3. 使用 video 的全屏模式： 如果 cover-view 在全屏模式下可以正常显示，可以考虑在非全屏状态下隐藏自定义控件，全屏时再显示。

   <template>
     <view>
       <video id="myVideo" @fullscreenchange="onFullscreenChange">
         <cover-view :class="{'controls': isFullscreen}">
           <cover-image src="/static/play.png" @tap="play"></cover-image>
         </cover-view>
       </video>
     </view>
   </template>
   
   <script>
   export default {
     data() {
       return {
         isFullscreen: false
       };
     },
     methods: {
       onFullscreenChange(e) {
         this.isFullscreen = e.detail.fullScreen;
       },
       play() {
         // 播放逻辑
       }
     }
   };
   </script>
   
   <style>
   .controls {
     display: none;
   }
   .controls.visible {
     display: block;
   }
   </style>