<template>
<div id="dplayer"></div>
</template>
<script setup>
import DPlayer from 'dplayer';
const dp = new DPlayer({
video: {
url: 'https://api.dogecloud.com/player/get.mp4?vcode=5ac682e6f8231991&userId=17&ext=.mp4',
},
});
</script>
<style scoped>
</style>
加上container还是报错哦
放在onMounted下面就可以了
<template>
<div id="dplayer"></div>
</template>
<script setup>
import { ref, onMounted } from "vue";
import DPlayer from 'dplayer';
import Hls from 'hls.js';
onMounted( () => {
new DPlayer({
//播放器的一些参数
container: document.getElementById('dplayer'),
video: {
url: 'https://api.dogecloud.com/player/get.mp4?vcode=5ac682e6f8231991&userId=17&ext=.mp4', //视频地址
}
});
})
</script>
需要传入容器
const dp = new DPlayer({
container: document.getElementById("dplayer"),
video: {
url: 'https://api.dogecloud.com/player/get.mp4?vcode=5ac682e6f8231991&userId=17&ext=.mp4',
},
});
你 少了容器的配置项
https://dplayer.diygod.dev/zh/guide.html#%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B
const dp = new DPlayer({
container: document.getElementById('dplayer'),
video: {
url: 'demo.mp4',
},
});