播放管理器

ESPlayerManager 集成

点击查看详细

第一步、引入ESPlayerManager组件,并声明在<template>


<es-player-manager
  ref='playerManager'
  :playerList='playerListRef'
  class='es-player-manager-page-css'
/>

第二步、集成并注册ESAudioServicePlayer音频播放组件。

import { ESAudioServicePlayer } from '@extscreen/es3-audio-service-player'

const playerList = [markRaw(ESAudioServicePlayer)]
const playerListRef = ref(playerList)

第三步、调用initialize方法进行初始化。

playerManager.value?.initialize()

第四步、设置播放数据。

注意:ESMediaItem 中播放器类型 type 需要设置为 5

点击查看播放器类型


//1.拼装 ESMediaSource 数据
const mediaSource: ESMediaSource = {
  uri: 'http://qcloudcdn.a311.ottcn.com/data_center/audios/ifengfm/1898049/9644712/2ff957624598b7b105d5c86b809c854c.mp3',
}
//2.拼装 ESMediaSourceList 数据
const mediaSourceList: ESMediaSourceList = {
  index: 0,
  list: [mediaSource],
}
//3.拼装 ESMediaItem 数据,类型为4
const mediaItem: ESMediaItem = {
  mediaSourceList,
  playerType: 5, //TODO 类型为5
}
//4.拼装 ESMediaItemList 数据
const playList: ESMediaItemList = {
  index: 0,
  list: [mediaItem],
}
playerManager.value?.playMediaList(playList)

第五步、默认自动进行播放。