• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

136
Views
LocalStorage no conserva los datos después de la actualización de la página

Tengo un problema con el getItem de mi localStorage en mi React Form. Puse un atributo onChange:

 <div className = 'InputForm' onChange={save_data}>

Encontré la función setItem para almacenar los datos. Aquí está la función:

 function save_data(){ let textarea = document.querySelectorAll("textarea") let input = document.querySelectorAll("input[type='text']") let saved_fields = [] textarea.forEach(x => { saved_fields.push({ key: x.className, value: x.value }) }) input.forEach(x => { saved_fields.push({ key: x.className, value: x.value }) }) localStorage.setItem("saved_data", JSON.stringify(saved_fields)) }

Mi principal problema es que no encuentro una manera de volver a colocar los datos en la página después de que se recarga la página. Acabo de descubrir cómo persistir todas mis entradas en la consola:

 window.onload = dataLoad(); function dataLoad () { let show_saved_data = localStorage.getItem("saved_data"); console.log('show_saved_data:',JSON.parse(show_saved_data)); }

¿Pueden ayudarme a encontrar la función de recuperación/persistencia de datos?

about 3 years ago · Juan Pablo Isaza
1 answers
Answer question

0

¿Podemos tener su formulario HTML para ayudarle? No debe identificar sus entradas/áreas de texto por su nombre de clase.

Después de eso, al usar ID como identificadores para su entrada/área de texto, solo tiene que hacerlo a la inversa:

  • Obtenga su lista de entrada/área de texto
  • para cada elemento, establezca el valor en función del ID
 function dataLoad () { var show_saved_data = localStorage.getItem("saved_data"); var inputList = JSON.parse(show_saved_data); inputList.forEach(x => { document.getElementById(x.key).setAttribute('value', x.value); }) }

Si nos proporciona su HTML/JS completo, será más fácil brindarle una solución completa.

about 3 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error