Stack Overflow en español Asked by Mariana on November 30, 2020
tengo una duda, cómo podría hacer que carguen los datos de localStorage en estados al renderizar un componente. Tengo una vista llamada MainForm donde se ejecuta una función que guarda los datos en firebase y posteriormente guarda el uid y la data en localStorage
const saveData = () => {
db.collection('user').add({
brand: brand.brand,
city: selectedCity,
model: model.model,
timestamp: Date.now()
})
.then((docRef) => {
localStorage.setItem('docRef', docRef.id)
console.log("Document written");
}).then(() => {
const getRef = localStorage.getItem('docRef')
db.collection("prospects").doc(getRef).onSnapshot(function(doc) {
localStorage.setItem('data', JSON.stringify(doc.data()))
})
})
.catch((error) => console.error("Error adding document: ", error));
}
después pasa a otro componente llamado Rates en el que quiero que cargue los datos de localStorage en estados para poder renderizar el contenido, lo estoy haciendo de este modo:
useEffect(() => {
const getRef = localStorage.getItem('docRef')
setDocRef(getRef)
const getData = localStorage.getItem('data')
const parseData = JSON.parse(getData)
setData(parseData)
}, [])
pero no renderiza porque no obtiene los datos, y en la consola primero me aparecen los console.log de Rates, y hasta después de esos me sale el del MainForm
Alguien podría ayudarme para saber qué es lo que puedo hacer o qué estoy haciendo mal?
Muchas gracias.
Para hacer la redirección a /planes
dentro de tu función saveData()
puedes hacerlo utilizando el HOC withRouter
del paquete react-router-dom
.
Por ejemplo:
import { withRouter } from 'react-router-dom'
const App = (props) => {
const { history } = props
const saveData = (e) => {
e.preventDefault() // para que no recargue la página
// tu código de saveData()
history.push('/planes')
}
return <button onClick={saveData}>Guardar datos</button>
}
export default withRouter(App)
Es necesario que tengas instalado el paquete react-router-dom
.
Correct answer by Gabri on November 30, 2020
Get help from others!
Recent Questions
Recent Answers
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP