react-hooks
react-hooks copied to clipboard
Adopt variant underlying state management
Pick useArray
as an example, this hook creates a bunch of convenient functions around Array
types, it manages a local state by using useState
in its implementation:
const [list, {push, removeAt}] = useArray();
<CreateForm onSubmit={push} />
<DeleteButton onClick={index => removeAt(index)} />
In real word, we often create states from variant sources, like recoil
's useRecoilState
, or a abstract [state, setState]
passed via Context
, then we are not able to create array functions around these states, this is an important missing functionality of a well designed hooks library.
For this reason, we're preparing to split some hooks into 2 parts:
- a
useSomethingWith([state, setState])
to wrap an existing state tuple - a
useSomething
hook depending on the previoususeSomethingWith
with a local state
After this, we can simple introduce useArrayWith
to help us manage global arrays like:
const globalListState = useRecoilState(globalListAtom);
const [globalList, {push, removeAt}] = useArrayWith(globalListState);