채팅 reactjs에서 메시지가 수신되면 맨 아래로 스크롤
const messagesEndRef:any = useRef(null)
const scrollToBottom = () => {
if (messagesEndRef) {
messagesEndRef.current.addEventListener('DOMNodeInserted', (event:any) => {
const { currentTarget: target } = event;
target.scroll({ top: target.scrollHeight, behavior: 'smooth' });
});
}
}
<div style={{height:"73vh",overflowY:"scroll",marginBottom:"50px"}} ref={messagesEndRef} >
{messages &&
messages.map((message:any) =>
<ChatItem
key={message.index}
message={message}
email={user.attributes.email}/>
)}
</div>
Reference
이 문제에 관하여(채팅 reactjs에서 메시지가 수신되면 맨 아래로 스크롤), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/mohsinalisoomro/scroll-bottom-when-message-recieve-in-chat-reactjs-3om7텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)