111

src/stores/modules/webrtcStore.js

@@ -241,6 +241,11 @@ export const useWebRTCStore = defineStore("webrtc", {
         this.localStream = null;
       }
 
+      if (this.remoteStream) {
+        this.remoteStream.getTracks().forEach((track) => track.stop());
+        this.remoteStream = null;
+      }
+
       this.iceCandidates = [];
       this.connectionState = "disconnected";
     },

src/views/im/components/CallController/index.vue

@@ -9,6 +9,7 @@
       />
       <div v-if="rtcStore.streamType == 'video'">
         <!-- 本地视频 -->
+        <spn>本地发起方</spn>
         <video
           ref="localVideo"
           autoplay
@@ -16,7 +17,7 @@
           muted
           class="local-video"
         ></video>
-
+      <spn>远端</spn>
         <!-- 远程视频 -->
         <video
           ref="remoteVideo"
@@ -136,15 +137,18 @@ function hangupCall() {
 watch(
   () => rtcStore.remoteStream,
   (val) => {
+    console.log("rtcStore.streamType===", rtcStore.streamType)
     if (val && rtcStore.streamType == "video" && remoteVideo.value) {
       remoteVideo.value.srcObject = val;
     }
-  }
+  },
+  { immediate: true }
 );
 
 watch(
   () => rtcStore.localStream,
   (val) => {
+        console.log("rtcStore.streamType===22", rtcStore.streamType)
     if (val && rtcStore.streamType == "video" && localVideo.value) {
       localVideo.value.srcObject = val;
     }