인프런 커뮤니티 질문&답변
작성한 질문수
chart update는 어떤 라이프 사이클 훅에 넣어야 하나요?
해결된 질문
작성
·
428
4
외부차트라이브러리 섹션 강의를 듣고 질문을 드립니다.
작업 플로우
1. 각 차트 컴포넌트에서 emit으로 refresh 이벤트를 App.vue에 보내고,
2. 업데이트된 차트 데이터를 각 차트 컴포넌트에 props로 내려 보낸 후에,(여기까지는 강의대로 잘 됐습니다.)
3. Chart.js 라이브러리에서는 차트.update() 라는 메소드를 실행해줘야 업데이트된 데이터에 맞게 차트가 다시 그려지는데요.
저 3번에서 차트.update() 는 어느 라이프 사이클 훅에 넣어야 하는지 질문 드립니다.
ps. 이미 비슷한 질문이 있었다면, 관련링크를 부탁드립니다.
답변 2
1
장기효(캡틴판교)
지식공유자
안녕하세요 성희님 좋은 질문이네요. 제가 알아보기 편하게 작업 플로우를 깔끔하게 정리해주셔서 감사합니다. 질의해주신 질문이 차트 라이브러리 갱신은 어떤 라이프 사이클에 해야 하느냐? 인 것 같은데요. 차트가 이미 그려진 상태에서 다시 갱신을 하시는 것이기 때문에 차트 컴포넌트를 통째로 삭제하지 않는 이상 다시 라이프사이클 훅을 이용할 순 없습니다. 따라서, 차트 컴포넌트에 내려주는 props 데이터가 바뀌었을 때 watch 메서드와 $nextTick API를 조합해서 차트를 갱신해보시면 좋을 것 같아요 :)
0
