useSessionStorage
Get and Set a specific value in the session storage.
Parameters
- the session storage key.
- the initial value of the key (default is
null
).
Return Values
It returns a tuple of 2 values:
Index | Name | Type | Description |
---|---|---|---|
0 | value | Any | the current session storage value. |
1 | setValue | Function | update the value. |
INFO
When you update a value on the session storage, a StorageEvent will be fired on window
.
Example Usage
tsx
import { useSessionStorage } from 'react-pre-hooks';
export default function Example() {
const [counter, setCounter] = useSessionStorage('counter', 0);
return (
<main>
<button onClick={() => setCounter(v => v + 1)}>+</button>
<span>{counter}</span>
<button onClick={() => setCounter(v => v - 1)}>-</button>
</main>
);
}
import { useSessionStorage } from 'react-pre-hooks';
export default function Example() {
const [counter, setCounter] = useSessionStorage('counter', 0);
return (
<main>
<button onClick={() => setCounter(v => v + 1)}>+</button>
<span>{counter}</span>
<button onClick={() => setCounter(v => v - 1)}>-</button>
</main>
);
}