vendredi 16 juillet 2021

Inline-if always uses the true condition

I was writing some reactJS code, when I wanted some conditional rendering. For that I made an inline-if, that renders a component if the variable rememberMe is true, but the code always renders the "if it's true part". Help would be appreciated.

    const [rememberMe, setRememberMe] = useState(localStorage.getItem('rememberMe'))
    const [asWho, setAsWho] = useState(localStorage.getItem('asWho'))

    useEffect(() => {
        localStorage.setItem('rememberMe', false)
        console.log(localStorage.getItem('rememberMe'))
        console.log(rememberMe)
        if (rememberMe === null) {
            localStorage.setItem('rememberMe', false)
            setRememberMe(false)
        }
    }, [])

    return (
        <div>
            { rememberMe ? <GroupList test={rememberMe} /> : <PleaseLogIn /> }
        </div>
    )

I printed rememberMe in <GroupList /> and it even prints false. Help would be much apprechiated.

export default function GroupList(params) {
    console.log(params.test)
    return (
        <div>
            logged in
            <br/>
            remember: {params.test}
        </div>
    )
}

Aucun commentaire:

Enregistrer un commentaire