-
질문 & 답변
카테고리
-
세부 분야
풀스택
-
해결 여부
미해결
자동 스크롤
20.08.18 12:16 작성 조회수 128
0
대화가 진행될 때 스크롤을 자동으로 아래로 내려가게 할려면 어떻게 해야하나요 ? 도와주세요!
답변을 작성해보세요.
1
John Ahn
지식공유자2020.08.18
앗 제가 강의에서 그 부분을 생략하고 넘어갔나 보네요 .... ;;
우선 아래 소스 보시면요
function Chatbot(props) {
const messageEndRef = useRef(null);
useEffect(() => {
if (messageEndRef.current) {
messageEndRef.current.scrollIntoView({ block: 'center', inline: 'center', behavior: 'smooth' });
}
});
return (
<div style={{ height: 700, width: 700, border: '3px solid black', borderRadius: '7px' }}>
<div style={{ height: 644, width: '100%', overflow: 'auto' }}>
{renderMessages(messagesFromRedux)}
<div ref={messageEndRef} />
</div>
<input style={{ margin: 0, width: '100%', height: 50, borderRadius: '4px', padding: '5px', fontSize: '1rem' }}
placeholder="Send a message..."
onKeyPress={keyPressHandler}
type="text" />
</div>
)
}
export default Chatbot
제가 일부로 이 스크롤 부분만 남기고 다른 소스는 지웠습니다 ~ !
이 부분을 이용해주세요 ^^
0
답변 2