userRef pour timer

README.md

@@ -54,6 +54,9 @@ où `tag` peut prendre comme valeur :
   voir `/src/components/personListing.component.jsx` ainsi que  `/src/components/person.component.jsx` 
 * `v 5.6` : utilisation des dépendances du hook `useEffect` pour déclencher son effet  
   voir `/src/components/person.component.jsx` 
+* `v5.7` : utilisation du hook `useRef`  et complément dépendances de `useEffect`  
+  voir `/src/components/person.component.jsx` 
+
   
 Faire ```git checkout main``` pour revenir à la version finale.
 

src/components/person.component.jsx

-import { useState, useEffect } from 'react';
+import { useState, useEffect, useRef } from 'react';
 
 import '../assets/style/person.css';
 
 const Person = ( { name = 'Anonymous', age, started, delay } ) => {
    
 const [ currentAge, setCurrentAge ] = useState(age);
+const timer = useRef( undefined );
 
 useEffect( () => {
+      clearInterval( timer.current );
       if (started) {
-            setInterval( () => setCurrentAge( previousCurrentAge => previousCurrentAge + 1 ), delay);
+         timer.current = setInterval( () => { 
+                                             setCurrentAge( previousCurrentAge => previousCurrentAge + 1 );
+                                             console.log('timer is running');
+                                       }, delay);
       }
-      }, [started] );
+   }, [started, delay] );
 
 return (
    <div className="person">Here is :