This is my code:
export default function Nav() {
const { userLogin } = useUser()
console.log(userLogin)
return (
<nav className={styles.nav}>
{!userLogin ? (
<Link href={"/login"}><a className={`${styles.top}`}></a></Link>
) : (
<Link href={"/profile"}><a className={`${styles.userLogged}`}></a></Link>
)}
</nav>
)
}
And this is useUser
:
export default function useUser(){
var userLogin = false
const cookies = parseCookies()
if (cookies.token) {
userLogin = true
}
return { userLogin }
}
So, if userLogin
is false
, everything is OK.
But if userLogin
is true
I get this error:
Warning: Prop `className` did not match. Server: "x" Client: "y"
This error show when I use cookies.
I don’t want to use next/dynamic
. because dynamic
reload component again on click.