[ETON 프로젝트] 회고록3

SignUp refactoring

state -> sotre 사용으로 코드 단순화

 

진심, 읽기 쉬운 코드를 적기위해 애썼다.

 

tag 마다 이름을 적절히 붙여주거나

state, props 적절히 분리 (각 tag 마다 고유 번호는 속성props 로 관리 즉, ids 가지고 다님)

 

리팩토링하면서 깨달은게,

progress 에만 MouseDown, MouseMove, MouseUp 이벤트를 달아주었다.

어쩐지 하위 컴포넌트인 Task card에서 이벤트가 잘 발생안하더라... ㅂㄷㅂㄷ 무튼,
Task Card 에도 달아주니깐 이제서야 제대로 event bubbling/캡처링 적용되려나

 

관여되고 있는 tag 들 목록(ids) 을 출력해보니

progress 움직일 때 : {board_id: 1, progress_id: 3}

task 움직일 때는 이벤트 버블링 (아래 -> 위) 이 일어나서 두번 출력된다. 각각 다르게

그럼, 이제 확실히 버블링 일어나는거 파악했고

Task 움직일때는 progress 까지 갈일 없으니

if(Object.keys(ids).length === 3) e.stopPropagation(); // 버블링 금지