[vue3] composition api에서 dom 접근하기 + 채팅 스크롤 아래로 이동시키기

composition api에서 dom div 등에 접근하려면
먼저 template 에서 ref로 설정해준다. ex- <div ref="test" ..>

그리고 나서, setup() 안에서 const test = ref() 변수를 설정해 주고
return에 함께 넣어준다.

문제는 template ref인 경우 렌더링이 끝나고 나서 접근이 가능하다.
따라서, setup 안에서 그냥 접근하면 소용이 없다.
setup 안에서 사용하려면 onMounted나 onUpdated 에서 접근해야 가능하다.

onUpdated(()=>{
	const div = test.value as HTMLDivElement; // 요게 중요
	div.scrollTop = div.scrollHeight; // 스크롤 자동으로 아래로 내리기
});

이런식으로 접근 및 처리가 가능하다.