Estoy tratando de hacer un programa donde obtienes de una API, y cada 3 segundos obtienes un nuevo valor, hasta ahora todo bien, obtengo el valor usando useEffect/useState.

 const [data, setData] = useState(); useEffect(() =>{ const interval = setInterval(() => { getData() },3000); return () => clearInterval(interval); },[]) //fetch the data function const getJoke = (() => { fetch('API URL') .then((res) => res.json()) .then((res) => { setData(res.value); }) .catch((err) => console.log(err)); })

Así que todo funciona bien con esto, los datos aparecen cada 3 segundos

 <button id="button" onClick = {handleGetT}>{isActive ? 'Get Data' : 'Stop'}</button> <h3>{isActive ? null : data}</h3>

Pero realmente estoy luchando para guardar el Me gusta como favorito. Tengo otro botón en el que, cuando haces clic, lo guardas en los datos del navegador de almacenamiento local.

 <button id="button" onClick = {localStorage.setItem("name",data)}>Save!</button>

Sé que lo anterior puede no ser la forma adecuada de hacerlo, por alguna razón obtengo diferentes datos guardados en el almacenamiento local cada 3 segundos, y me gustaría guardarlos cuando hago clic en la broma que aparece, digamos en una matriz, para poder utilícelo más tarde para imprimirlo.