From 9fe05246dfe6f05f2b97d2901825ae5226e8dd57 Mon Sep 17 00:00:00 2001
From: Ritik Sachan <sachanritik1@gmail.com>
Date: Sun, 27 Oct 2024 18:09:56 +0530
Subject: [PATCH] Fix:7255- clear interval on unmount

---
 src/content/reference/react/useRef.md | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/content/reference/react/useRef.md b/src/content/reference/react/useRef.md
index 14cd9b2ecf3..d2bf4a2004e 100644
--- a/src/content/reference/react/useRef.md
+++ b/src/content/reference/react/useRef.md
@@ -140,7 +140,8 @@ This example uses a combination of state and refs. Both `startTime` and `now` ar
 <Sandpack>
 
 ```js
-import { useState, useRef } from 'react';
+
+import { useState, useRef, useEffect } from 'react';
 
 export default function Stopwatch() {
   const [startTime, setStartTime] = useState(null);
@@ -166,6 +167,13 @@ export default function Stopwatch() {
     secondsPassed = (now - startTime) / 1000;
   }
 
+  // clear interval when component unmounts
+  useEffect(()=>{
+    return ()=>{
+      handleStop();
+    }
+  },[])
+
   return (
     <>
       <h1>Time passed: {secondsPassed.toFixed(3)}</h1>