useLocalStorage

Hook to manage a value that syncs with localStorage.

Usage

Live Editor

function App() {
	const [name, setName] = useLocalStorage("name", "John Doe");

	return (
		<div>
			<p>Name: {name}</p>
			<input
				type="text"
				value={name}
				onChange={(e) => setName(e.target.value)}
			/>
		</div>
	);
}

Result

Loading...

API

Parameter

• key : string - The key to store the value in localStorage.
• initialValue : T - The initial value to store in localStorage.

Returns : An array with the following elements:

• value : T - The value stored in localStorage.
• setValue : (value: T) => void - A function to set the value in localStorage.