공부기록, 2021-08-27(react atom)

되지 않고 atom의 값을 읽어야 하는 드문 경우는 useRecoilCallback()를 참조하면 된다.

정적인 값으로 atom을 초기화하거나 같은 유형의 값을 나타내는 Promise 또는 RecoilValue을 사용하여 원자를 초기화할 수 있다. 왜냐하면 Promise가 보류 중이거나 기본 selector가 비동기일 수 있기 때문에 atom의 값도 보류 중이거나 읽을 때 오류를 발생시킬 수 있다는 것을 의미한다. 현재 atom을 설정할 때 Promise을 지정할 수 없다는 점에 유의해야 한다. 비동기 함수를 사용하기 위해서는 selectors를 사용한다.

atom은 Promise나 RecoilValues를 직접 저장하는 데 사용할 수 없지만 객체를 감쌀 수도 있다. Promises은 변경될 수 있다는 점에 유의해야 한다. Atom은 function로 설정할 수 있지만, 함수가 순수하다면, 그러기 위해서는 setter형태의 updater를 사용해야 할 수도 있다. (예: set(myAtom, () => myFunc);).

예시#

import {atom, useRecoilState} from 'recoil';

 

const counter = atom({

key: 'myCounter',

default: 0,

});

 

function Counter() {

const [count, setCount] = useRecoilState(counter);

const incrementByOne = () => setCount(count + 1);

 

return (

<div>

Count: {count}

<br />

<button onClick={incrementByOne}>Incrementbutton>

div>

);

}