fix

src/views/coursewarePlay/component/video-play.tsx

@@ -1,4 +1,4 @@
-import { defineComponent, nextTick, onMounted, toRefs } from 'vue'
+import { defineComponent, nextTick, onMounted, toRefs, watch } from 'vue'
 import 'plyr/dist/plyr.css'
 import Plyr from 'plyr'
 import { ref } from 'vue'
@@ -21,6 +21,10 @@ export default defineComponent({
     isEmtry: {
       type: Boolean,
       default: false
+    },
+    isActive:{
+      type: Boolean,
+      default: false
     }
   },
   emits: ['loadedmetadata', 'togglePlay', 'ended', 'reset'],
@@ -150,6 +154,11 @@ export default defineComponent({
       changePlayBtn,
       toggleHideControl
     })
+    watch(() => props.isActive, (val) => {
+      if (!val) {
+        videoItem.value?.pause()
+      }
+    })
     return () => (
       <div class={styles.videoWrap}>
         <video

src/views/coursewarePlay/index.tsx

@@ -441,8 +441,9 @@ export default defineComponent({
     const handleStop = () => {
       for (let i = 0; i < data.itemList.length; i++) {
         const activeItem = data.itemList[i]
-        if (activeItem.type === 'VIDEO' && activeItem.videoEle) {
-          activeItem.videoEle.stop()
+        if (activeItem.type === 'VIDEO') {
+          activeItem.videoEle?.pause()
+          activeItem.videoEle?.stop()
         }
         // console.log('🚀 ~ activeItem:', activeItem)
         // 停止曲谱的播放
@@ -710,7 +711,7 @@ export default defineComponent({
           >
             <div class={styles.wraps}>
               {data.itemList.map((m: any, mIndex: number) => {
-                const isRender = m.isRender || Math.abs(popupData.activeIndex - mIndex) < 2
+                const isRender = true // m.isRender || Math.abs(popupData.activeIndex - mIndex) < 2
                 const isEmtry = Math.abs(popupData.activeIndex - mIndex) > 4
                 if (isRender) {
                   m.isRender = true
@@ -755,6 +756,7 @@ export default defineComponent({
                         <VideoPlay
                           ref={(v: any) => (data.videoRefs[mIndex] = v)}
                           item={m}
+                          isActive={popupData.activeIndex === mIndex}
                           isEmtry={isEmtry}
                           onLoadedmetadata={(videoItem: any) => {
                             m.videoEle = videoItem