[Recoil] selector

Selector

 

selector는 recoil에서 함수 또는 파생된 상태(atom의 상태에서 파생된 데이터, 즉 atom의 상태에 의존하는 동적인 데이터), atom의 상태에 대해 항상 동일한 값을 반환하는 순수함수.

 

공식문서: https://recoiljs.org/docs/basic-tutorial/selectors/

 

 

selector를 사용하는 이유

 

최소한의 state만 atom에 저장하고 다른 모든 파생되는 데이터는 selector의 함수를 통해 효율적으로 계산함으로써 쓸모없는 상태의 보존을 방지할 수 있다.

 

state 관리를 위해 recoil을 사용하고 화면과 분리하여 state를 관리하고자 recoil을 사용하는데, 화면에서 다시 state를 관리하는 로직이 있다면 본래 취지와 어긋나서 로직이 파편화되는 문제가 발생할 수밖에 없다. 따라서 recoil에서 selector를 제공하여 state를 관리하는 로직까지 같이 포함하는 것이다.

 

 

사용 Case

• state를 가져와서(get) 다른 값으로 변경(set)할 때.
• 여러 state를 가져와서 조합할 때.
• Rest API와 조합하여 서버데이터를 관리할 때.

 

state가 변경될 때마다 selector도 재조회를 한다고 한다. selector를 사용하는 가장 중요한 이유이자 주의해야 할 부분이다.

 

 

get : 파생된 상태의 값을 평가하는 함수. 매개변수로 콜백 객체를 받으며, 콜백 객체 내의 get 메서드를 이용해 다른 atom이나 selector를 가져온다.

 

set : 이 속성이 설정되면 selector는 쓰기 가능한 상태가 된다. 콜백 객체와 새로운 값 2가지를 매개변수로 받으며, 콜백 객체 내의 set 메서드를 이용해 다른 atom의 값을 새로운 값으로 변경시킨다.