hookehuyr

refactor(视频播放器): 优化暂停逻辑并添加引用

在VideoPlayer组件中,将暂停逻辑从`videoRef.value?.$player`改为直接使用`player.value`,以提高代码可读性和维护性。在UploadVideoPopup组件中,添加`videoPlayerRef`引用,确保在提交和取消时暂停视频播放
......@@ -30,7 +30,7 @@
</div>
<div v-if="videoUrl" class="video-preview">
<VideoPlayer :video-url="videoUrl" :autoplay="false" />
<VideoPlayer ref="videoPlayerRef" :video-url="videoUrl" :autoplay="false" />
</div>
</div>
</div>
......@@ -115,11 +115,14 @@ const onOversize = () => {
showToast('文件大小不能超过100MB');
};
const videoPlayerRef = ref(null);
const onSubmit = () => {
if (!videoUrl.value || !videoId.value) {
showToast('请先上传视频');
return;
}
videoPlayerRef.value?.pause();
emit('submit', {
url: videoUrl.value,
id: videoId.value,
......@@ -129,6 +132,7 @@ const onSubmit = () => {
};
const onCancel = () => {
videoPlayerRef.value?.pause();
emit('cancel');
emit('update:modelValue', false);
};
......
......@@ -109,8 +109,8 @@ onBeforeUnmount(() => {
defineExpose({
pause() {
if (videoRef.value?.$player) {
videoRef.value.$player.pause();
if (player.value) {
player.value.pause();
}
},
});
......