Tengo problemas para usar los datos de LocalStorage.
Usé storejs (biblioteca localStorage), por lo tanto, store.getItem
es igual a localStorage.getItem y store.setItem
es igual a localStorage.setItem.
por favor revisa mi código.
const test = () => { useEffect(() => { const res = store.getItem('data') // I'm trying toexecutes following code if store returns undefined. if(!res) { store.setItem('data', [{name:'aden', age:17}]) store.getItem('data') } },[]) return <></> }
Sé que este código no funciona. Sin embargo, lo que estoy tratando de hacer es cuando el componente se monta y no hay nada en LocalStorage, quiero establecer inmediatamente el elemento en setItem
y buscar el elemento de inmediato.
Sin embargo, con ese código, no obtengo nada de LocalStorage. Parece que tengo una idea errónea sobre el ciclo de vida de la reacción.
¿Cómo puedo resolver el problema?
Prueba esto:
import React, { useState } from "react"; const Test = () => { const [user, setUser] = useState(JSON.parse(localStorage.getItem("user"))); const addToLocalStorage = () => { const payload = [{ name: "aden", age: 17 }]; setUser(payload); localStorage.setItem("user", JSON.stringify(payload)); }; return ( <> <div> {user?.length > 0 && user.map((e) => <span key={e.name}>name:{e.name}</span>)} </div> <button onClick={addToLocalStorage}>Add to localStorage</button> </> ); }; export default Test;
useEffect(() => { const res = store.getItem('datos')
// I'm trying toexecutes following code if store returns undefined. if(!res) { store.setItem('data', [{name:'aden', age:17}]) store.getItem('data') }
},[]) Tal vez debería escribir store.setItem