next-themes
next-themes copied to clipboard
[Bug]: Refreshing the page will reset it to light
What happened?
When I setTheme toggle, LocalStorage successfully becomes dark
.
But when I refresh the page, it is reset to light
- providers.tsx
<NextUIProvider>
<ThemeProvider attribute="class">
{children}
</ThemeProvider>
</NextUIProvider>
- component.tsx
'use client'
import { useTheme } from 'next-themes'
import { Switch } from '@nextui-org/react'
import React from 'react'
export function DarkMode() {
const { setTheme, theme } = useTheme()
return (
<Switch
size="sm"
aria-label="Dark Mode"
defaultSelected={theme === 'dark'}
onValueChange={(isSelected) => {
setTheme(isSelected ? 'dark' : 'light')
}}
/>
)
}
Version
"next-themes": "^0.3.0",
What browsers are you seeing the problem on?
Chrome