react-recoil-4.js

import {atom, selector, useRecoilValue} from 'recoil';

const nameStateAtom = atom({
  key: 'nameStateAtom',
  default: ''
});
const nameStateSelector = selector({
  key: 'nameStateSelector',
  get: ({get}) => get(nameStateAtom)
});

function NameDisplay() {
  const name = useRecoilValue(nameStateAtom);
  const nameSelector = useRecoilValue(nameStateSelector);
  return (
    <>
      Name: {name}
      <br />
      Name from selector: {nameSelector}
   </>
  );
}