[Recoil] Selector

1. Selector

① Selector의 정의

 

Recoil에서 Selector란 파생된 상태 (derived state)의 일부를 나타낸다.

여기서 파생된 상태 (derived state)란 기존 recoil state (atom)를 입력 받고

그걸 변형해서 반환하는 순수 함수에 전달된 상태 (state)의 결과물이라고 보면 된다.

 

이러한 Selector는 selector() 함수를 통해서 생성할 수 있다.

const toDoSelector = selector({
    key: "toDoSelector", //고유 key 값
    get: ({get}) => {}
});

---

② get

 

Selector의 get 속성은 get 메서드를 인자로 전달 받는다.

이때 전달받은 get 함수를 통해서 atom이나 다른 Selector의 값에 접근할 수 있다.

//Atom, Selector Sample
const AtomSample = atom({...});
const SelectorSample = selector({...});

const Exam = selector({
    key: "SelectorExam",
    get: ({get}) => {
    	//인자로 전달한 get() 함수를 통해
        //Atom이나 다른 Selector의 값을 받아올 수 있다.
    	const getAtom = get(AtomSample);
        const getSelector = get(SelectorSample);
    }
});

 

Exam이란 이름의 Selector는 get() 함수를 통해, AtomSample과 SelectorSample의 값을 받아왔다.

이때 Exam과 AtomSample, SelectorSample 간의 종속 관계가 형성된다.

 

Exam이 참조하고 있는 AtomSample, SelectorSample에 업데이트가 발생되면

이를 참조하는 Exam에서도 get() 함수를 재실행해서 업데이트를 반영한다.

---

③ set

---

2. Selector 예제