小程序一些问题及解决方案_小程序ios视频不自动播放,如何解决-优快云博客

组件video 第二次播放不能自动播放

问题

最近开发小程序发现弹框 video第二次不能自动播放，网上找资料迟迟不能解决

后突发奇想会不会是隐藏元素的原因，经测试发现竟是 hidden 原因，hidden只会隐藏元素，不会销毁

解决

因为元素隐藏使用了 hidden，改为 wx:if 即可

小程序 ios 视频黑屏

解决

<video src="" custom-cache="{{false}}"></video>

小程序自定义导航栏顶部固定，遮挡下方元素

问题

自定义导航栏时，fixed 并没用占位，使其遮挡了其他元素，通常用占位view可解决，但导航栏高度是变化的（刘海屏会更高）

解决

量测得知非刘海屏导航栏高度为64px；刘海屏导航栏高度为88px；

获取状态栏高度，判定手机是否为刘海屏，结合使用占位view

const systemInfo = uni.getSystemInfoSync()
this.globalData.systemInfo = systemInfo
console.log(systemInfo.statusBarHeight)
let navBarHeight = systemInfo.statusBarHeight + 44 + 'px'
this.globalData.navBarHeight = navBarHeight

<template>
  <view>
    <uni-nav-bar class="my-nav" color="#ffffff" background-color="#EE3311" :status-bar="true">
    </uni-nav-bar>
    <view class="my-nav2" :style="{height: navBarHeight}"></view>
  </view>
</template>

<script>
  let app = getApp()
  export default {
    components: {},
    data() {
      return {
        navBarHeight: app.globalData.navBarHeight
      }
    },
    props: {
    },
    methods: {
    }
  }
</script>
<style>
  .my-nav2 {
    width: 100%;
  }

  .my-nav {
    z-index: 100;
    overflow: hidden;
    position: fixed;
    width: 100%;
    top: 0;
  }
</style>

OK.