- Recoil Selector 를
useRecoilState훅 으로 사용const [hours, setHours] = useRecoilState(hourSelector);- hours :
atoms.tsx에서 selector 의 get 함수값 atoms.tsx에서 selector 의 set 함수(프로퍼티)를 사용해서 selector 의 값을 변경할 수 있습니다.
- hours :
- 하나의 atom 으로 두 개의 atom이 있는 것 같이 사용할 수 있습니다.
- 긴밀하게 연결된 두개의 atom 인 느낌
- React-Beautiful-DnD
- 리액트에서 드래그 앤 드롭 구현을 도와주는 라이브러리
- DragDropContext 컴포넌트 : 드래그 앤 드롭을 가능하게 하고자 하는 영역을 감싸는 컴포넌트
- onDragEnd : 유저가 드래그를 끝낸 시점에 불려지는 함수
- Droppagble 컴포넌트
- 우리가 어떤 것을 드롭 할 수 있는 영역
- 각각의 리스트들은 무언가를 드롭할 수 있는 영역이여야함
- 프로퍼티로
droppableID줘야함 - children 으로 함수를 줘야함
- Draggable 컴포넌트
- 우리가 드래그할 수 있는 영역을 의미
- 리스트에 있는 각 아이템들은 드래거블
- 프로퍼티로
draggerbleID,index줘야함 - children 으로 함수를 줘야함
- Draggable 컴포넌트의
dragHandleProps- Drag 가능 한 영역을 설정 해줄 수 있다.
Aim for the TOP, Developer