| title |
|---|
atomWithHash |
atomWithHash(key, initialValue, options): PrimitiveAtomThis creates a new atom that is connected with URL hash. The hash must be in the URLSearchParams format. It’s a two-way binding: changing the atom value will change the hash and changing the hash will change the atom value. This function works only with DOM.
key (required): a unique string used as the key when syncing state with localStorage, sessionStorage, or AsyncStorage
initialValue (required): the initial value of the atom
options (optional): an object of options to customize the behavior of the atom
serialize (optional): a custom function to serialize the atom value to the hash. Defaults to JSON.stringify.
deserialize (optional): a custom function to deserialize the hash to the atom value. Defaults to JSON.parse.
delayInit (optional): delay initialization of the atom to when onMount is called. See #739. Defaults to true.
replaceState (optional): when the atom value is changed, replace the current history entry instead of adding a new one. See #660. Defaults to false.
subscribe (optional): custom hash change subscribe function
import { useAtom } from 'jotai'
import { atomWithHash } from 'jotai/utils'
const countAtom = atomWithHash('count', 1)
const Counter: React.FC = () => {
const [count, setCount] = useAtom(countAtom)
return (
<>
<div>count: {count}</div>
<button onClick={() => setCount((c) => c + 1)}>button</button>
</>
)
}Please refer atomWithStorage for the usage about deleting items.