微信小程序的媒体组件

微信小程序中的媒体组件主要包括音频组件 和视频组件 ，它们可以帮助开发者在小程序中嵌入和播放多媒体内容。以下是对这两个组件的详细介绍：

1. 音频组件
   组件用于在小程序中播放音频文件。它支持多种配置选项和事件处理。

属性
src: 音频资源的 URL 地址。
controls: 是否显示默认控件（播放、暂停、音量等）。
autoplay: 是否自动播放。
loop: 是否循环播放。
muted: 是否静音播放。
initial-time: 音频开始播放的初始位置，单位为秒。
id: 音频组件的唯一标识符。
poster: 音频封面图 URL。
事件
bindplay: 当音频开始或继续播放时触发。
bindpause: 当音频暂停时触发。
bindended: 当音频播放至结束时触发。
bindtimeupdate: 播放进度变化时触发，触发频率约为 250ms 一次。
binderror: 音频播放发生错误时触发。
示例代码

<audio 
  src="https://example.com/audio.mp3" 
  controls 
  autoplay 
  loop 
  poster="https://example.com/poster.jpg"
  bindplay="onPlay"
  bindpause="onPause"
  bindended="onEnded"
/>

2. 视频组件
   组件用于在小程序中播放视频文件，同样支持丰富的配置选项和事件处理。

属性
src: 视频资源的 URL 地址。
controls: 是否显示默认控件（播放、暂停、全屏等）。
autoplay: 是否自动播放。
loop: 是否循环播放。
muted: 是否静音播放。
initial-time: 视频开始播放的初始位置，单位为秒。
poster: 视频封面图 URL。
object-fit: 视频对齐方式，可选值有 contain, fill, cover。
play-btn-position: 播放按钮的位置，可选值有 bottom, center。
danmu-btn: 是否显示弹幕按钮，默认值为 false。
danmu-list: 弹幕列表。
enable-danmu: 是否展示弹幕，默认值为 false。
事件
bindplay: 当视频开始或继续播放时触发。
bindpause: 当视频暂停时触发。
bindended: 当视频播放至结束时触发。
bindtimeupdate: 播放进度变化时触发，触发频率约为 250ms 一次。
bindfullscreenchange: 全屏切换时触发。
binderror: 视频播放发生错误时触发。
示例代码

<video 
  src="https://example.com/video.mp4" 
  controls 
  autoplay 
  loop 
  poster="https://example.com/poster.jpg"
  object-fit="contain"
  bindplay="onPlay"
  bindpause="onPause"
  bindended="onEnded"
  bindfullscreenchange="onFullscreenChange"
  binderror="onError"
/>