Svelte (1) 썸네일형 리스트형 [Svelte] 채팅 시스템 - 새로운 채팅이 생겼을 때 스크롤을 맨 아래로 내리는 방법 채팅 시스템을 만드는 프로젝트를 만들다가새로운 채팅이 생겼을 때 해당 채팅으로 스크롤을 내리는 기능이 필요했습니다.이렇게요! 구현 방법: beforeUpdate() & afterUpdate()전체 코드를 먼저 보겠습니다....{#each chatLogs as chat, idx} {/each}... 저는 채팅 메시지를 저장할 배열(chatLogs)을 만들었습니다. 그리고 채팅 메시지 한 건마다 'data-chat-id' 라는 값을 부여해줬습니다. (이 부분은 나중에 백엔드와 연결되면 메시지의 id 가 되겠죠?)왜냐면 data-chat-id 값을 찾아서 해당 태그로 스크롤 이동을 해야하기 때문이죠. 마지막으로 새로운 채팅이 배열에 추가될 때 마다 beforeUpdate() 와 afterUpdate().. 이전 1 다음