resetAtom
helper
Helper atoms are created using createAtom
. They are similar to the atom
function, except that they add new functionality to the atom using hooks
.
This resetAtom
helper can be used to create an atom that is resetable to its initial value at any time.
Start by creating the atom:
import { resetAtom } from 'particule'
export const textAtom = resetAtom('Hello World')
Use it the same way as you would with an atom:
function App() {
const [value, setValue] = useAtom(textAtom)
return (
<div>
<h1>{value}</h1>
<button onClick={() => setValue('Updated!')}>
Change text
</button>
</div>
)
}
And use the useResetAtom
hook to reset it at anytime to its initial value:
import { useResetAtom } from 'particule'
function Reset() {
const reset = useResetAtom(textAtom)
return <button onClick={reset}>Reset</button>
}