useLocalStorage
HookLike useState, but persists the value in localStorage. SSR-safe.
npx arupui add use-local-storage
Usage
use-local-storage.tsx
import { useLocalStorage } from "@/hooks/use-local-storage"
function Settings() {
const [theme, setTheme] = useLocalStorage("theme", "light")
return (
<button onClick={() => setTheme(t => t === "light" ? "dark" : "light")}>
Current: {theme}
</button>
)
}Parameters
| Parameter | Type | Description |
|---|---|---|
key | string | localStorage key |
initialValue | T | Default value if key doesn't exist |
keystringlocalStorage key
initialValueTDefault value if key doesn't exist
Returns
[T, (value: T | (val: T) => T) => void]