0

Estoy realizando un proyecto de registrer y login en js. Y estoy usando localStorage. Mi itencion es que cuando el usuario ingresa, te redirecciona al index, y el boton que antes se llamaba 'acceso a tu cuenta' Pase a llamarse el nombre del usuario que ingreso. Eso es lo que no estoy pudieron lograr. Voy a compartir el codigo para que pueda ser mas claro.

Codigo .js

const loginForm = document.querySelector('#loginForm')
loginForm.addEventListener('submit', (e)=>{
    e.preventDefault()
    const nombreLogin = document.querySelector('#namelogin').value
    const passwordLogin = document.querySelector('#passlogin').value

    const Users = JSON.parse(localStorage.getItem('users')) || []
    const validUser = Users.find(user => user.name === nombreLogin && user.pass === passwordLogin)
    if(!validUser){
        return alert('Usuario y/o contraseña incorrectos!')
    }
    alert(`Bienvenido ${validUser.name}`)
    localStorage.setItem('login_success', JSON.stringify(validUser))
    window.location.href = 'index.html'

})

Y luego en el index:

<script>
    const nombreUsuario = JSON.parse(localStorage.getItem('login_success'))
    const user = JSON.parse(localStorage.getItem('login_success')) || false
    const nameusuario = JSON.parse(localStorage.getItem('validUser'))
    if(user){
        const botonLogin = document.getElementById('accesoUsuario')
        this.textContent = `${validUser.name}`;
    }
</script>

Soy relativamente nuevo en JS. Y voy integrango partes de distintas fuentes. Puede que no este del todo optimizado el codigo. Pero funciona. Aclaro que es solo para uso totalmente academico y practica personal. No es para trabajo ni puesta en produccion.

Asi que cualquier comentario es de total utilidad.

Gracias!!


Pude resolverlo, y elijo no borrar el post por si a alguien le sirve. Como quedo modificado el codigo .js

localStorage.setItem('login_success', JSON.stringify(validUser.name))

Y el index:

const nombreUsuario = JSON.parse(localStorage.getItem('login_success'))
    const user = JSON.parse(localStorage.getItem('login_success')) || false
    const botonLogin = document.getElementById('accesoUsuario')
    if(user){
        botonLogin.innerHTML = nombreUsuario.name
    }
2
  • ¿Podría por favor proporcionar el HTML para que todos puedan replicarlo individualmente y tener la misma visión de tu proyecto y encontrar una solución que se adapte mejor? el 30 sep. a las 21:53
  • En lugar de responder en tu pregunta, considera borrar esa respuesta y añadirla como respuesta real, así de paso te ganas unos puntitos.
    – track3r
    el 1 oct. a las 8:07

0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Examina otras preguntas con la etiqueta o formula tu propia pregunta.