How to share state operation ? about recoil

[davidmccabe]

Here's how I would do it:

function useCounter() {
  const [value, setValue] = useRecoilState(countAtom);
  const add = useCallback(() => {setCount(x => x + 1)});
  return {value, add};
}

To make a family of atoms, just create a memoized function that returns a distinct atom for each state:

memoize(id => atom({
 key: `whatever${id}`,
 default: 123,
}));

where memoize is any memoization function you provide.

We are going to open-source a utility called atomFamily/selectorFamily that does this for you in the near future.

[xialvjun]

Thanks.
In fact, I'm so dumb that I missed the point of your answer. I used to think we need to copy code in every component like:

// counterAtom.js
export const counter = atom({
  key: 'counter',
  default: 0,
});
export const operations = (setValue) => ({
  inc: () => setValue(s => s+1),
  dec: () => setValue(s => s-1),
});

// myCom.jsx --- copy the code everywhere
const [value, setValue] = useRecoilState(countAtom);
const operations = useMemo(()=>counterOperations(setValue));

I forgot to use hook to extract logic to outside of component.
Just a mark.

[davidmccabe]

Actually I think it's already in the repo, the build just isn't configured to include it. If you can figure out how to set up the build to include the RecoilUtils module as a separate module e.g. recoil/utils in the built output, that'd be a nice PR.

[tony-go]

I give a try #33

Hope it help :)