Accessing localStorage in layout.tsx
Answered
Peruvian Inca Orchid posted this in #help-forum
Peruvian Inca OrchidOP
I'm using react and nextjs 13 for my website.
Basically I've a theme toggle option and it saves the theme using localStorage. I want to access the theme from localStorage before rendering the page so that I can put it in my body. Can anyone please help me with this?
Basically I've a theme toggle option and it saves the theme using localStorage. I want to access the theme from localStorage before rendering the page so that I can put it in my body. Can anyone please help me with this?
Answered by Peruvian Inca Orchid
you mean to create a component which has the theme properties, and then importing it to layout.tsx and using something like
<Theme />, right?8 Replies
@@ts-ignore Read [this](https://nextjs-faq.com/browser-api-client-component)
Peruvian Inca OrchidOP
in the layout.tsx if I use "use client", then it gives an error that router is not mounted
@Peruvian Inca Orchid in the layout.tsx if I use "use client", then it gives an error that router is not mounted
it is not recommended to make your layout a client component
create another client component which takes care of the theme and mount it in layout
Peruvian Inca OrchidOP
you mean to create a component which has the theme properties, and then importing it to layout.tsx and using something like
<Theme />, right?Answer
Peruvian Inca OrchidOP
ok, let me give it a try
that can cause flash of content with different theme