<template>
  <div id="word-video" class="video_box"></div>
</template>
<script setup lang="ts">
import { useAudio } from '@/hooks'
import 'xgplayer/dist/index.min.css'

const props = defineProps<{
  url: string
}>()

const isShow = ref(false)
const textBox = ref()
const triggerWrapper = ref()

function onEnded() {
  console.log('播放结束')
}

function init() {
  useAudio({
    id: 'word-video',
    url: props.url,
    autoplay: false,
    lang: 'zh-cn', // 设置中文
    videoInit: true,
    onEnded: onEnded,
  })
}
onMounted(() => {
  init()
})
</script>
<style scoped lang="scss">
//
#word-video {
  height: 100% !important;
  width: 100% !important;
}
</style>
