uni-app video组件在ios不能切换autoplay

开发环境	版本号	项目创建方式
Windows	win10	HBuilderX

产品分类：
uniapp/App

PC开发环境操作系统：
Windows

HBuilderX类型：
正式

HBuilderX版本号：
3.4.7

手机系统：
iOS

手机系统版本号：
iOS 13.4

手机厂商：
苹果

手机机型：
ipad

页面类型：
vue

vue版本：
vue3

打包方式：
云端

操作步骤：
默认isAutoPlay=false;
用户操作后设置为ture并修改src

预期结果：
视频自动播放

实际结果：
没有自动播放

bug描述：

```javascript  
<video id="myVideo" :src="src" :autoplay="isAutoPlay" style="width: 100%;height: 400rpx;"   objectFit="contain">  
</video>  
经过测试，ios下如果一开始autoplay是false，后面即使设置为true再修改src也不会自动播放，手动点击播放按钮可以播放。

itying888 1楼•20 天前作者

可以用.play()手动播放

sinazl 2楼•20 天前

在 uni-app 中使用 video 组件时，iOS 设备上可能会遇到 autoplay 属性无法正常工作的问题。这是由于 iOS 系统的自动播放策略限制，iOS 设备通常不允许视频自动播放，除非用户与页面进行了交互（例如点击了某个按钮）。

解决方案

用户交互触发播放：你可以通过用户交互（如点击按钮）来触发视频播放。例如：

<template>
  <view>
    <video id="myVideo" :src="videoSrc" controls></video>
    <button @click="playVideo">播放视频</button>
  </view>
</template>

<script>
export default {
  data() {
    return {
      videoSrc: 'https://www.example.com/sample.mp4'
    };
  },
  methods: {
    playVideo() {
      const videoContext = uni.createVideoContext('myVideo');
      videoContext.play();
    }
  }
};
</script>

静音自动播放： iOS 允许静音视频自动播放。你可以将 muted 属性设置为 true，这样视频可以在页面加载时自动播放。

<template>
  <view>
    <video :src="videoSrc" autoplay muted controls></video>
  </view>
</template>

<script>
export default {
  data() {
    return {
      videoSrc: 'https://www.example.com/sample.mp4'
    };
  }
};
</script>

使用 poster 属性：你可以使用 poster 属性来显示视频的封面图，这样用户可以看到视频的预览图，并手动点击播放。

<template>
  <view>
    <video :src="videoSrc" :poster="posterImage" controls></video>
  </view>
</template>

<script>
export default {
  data() {
    return {
      videoSrc: 'https://www.example.com/sample.mp4',
      posterImage: 'https://www.example.com/poster.jpg'
    };
  }
};
</script>

监听页面加载事件：如果你希望在页面加载时自动播放视频，可以尝试在 onLoad 生命周期钩子中触发播放。但请注意，iOS 可能仍然会阻止自动播放。

<template>
  <view>
    <video id="myVideo" :src="videoSrc" controls></video>
  </view>
</template>

<script>
export default {
  data() {
    return {
      videoSrc: 'https://www.example.com/sample.mp4'
    };
  },
  onLoad() {
    const videoContext = uni.createVideoContext('myVideo');
    videoContext.play();
  }
};
</script>