src/page/Meeting/ChatSmallWindow/index.tsx

@@ -8,17 +8,16 @@ const ChatSmallWindow: React.FC = () => {
   const [isExpand, setIsExpand] = useState(false)
   const channel = new BroadcastChannel('meeting_channel');
   useEffect(() => {
-    let time: NodeJS.Timeout;
-    time = setInterval(() => {
-      setChatLists((res: any) => {
-        return res.length ? res.slice(0, -1) : res
-      })
-    }, 10000)
     channel.onmessage = function (event) {
       const { type, chatListIten } = event.data;
       switch (type) {
         case 'chatListIten':
-          setChatLists((newChatList: any) => [chatListIten, ...newChatList])
+          setChatLists((newChatList: any) => {
+            chatListIten.timer = setTimeout(() => {
+              removeItemByIndex();
+            }, 3000);
+            return [chatListIten, ...newChatList]
+          })
           setTimeout(() => {
             const chatSmallWindowView = document.getElementById('chatSmallWindowView') as HTMLElement;
             if (chatSmallWindowView) {
@@ -28,11 +27,12 @@ const ChatSmallWindow: React.FC = () => {
           break;
       }
     }
-    return () => {
-      clearTimeout(time)
-    }
   }, []);
-
+  const removeItemByIndex = () => {
+    setChatLists((res: any) => {
+      return res.slice(0, -1)
+    })
+  }
 
   return (
     <>