자동 스크롤

Question

대화가 진행될 때 스크롤을 자동으로 아래로 내려가게 할려면 어떻게 해야하나요 ? 도와주세요!

John Ahn · Answer

앗 제가 강의에서 그 부분을 생략하고 넘어갔나 보네요 .... ;; 우선 아래 소스 보시면요 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 } /> < input style = {{ margin : 0 , width : ' 100% ' , height : 50 , borderRadius : ' 4px ' , padding : ' 5px ' , fontSize : ' 1rem ' }} placeholder = " Send a message... " onKeyPress = { keyPressHandler } type = " text " /> ) } export default Chatbot 제가 일부로 이 스크롤 부분만 남기고 다른 소스는 지웠습니다 ~ ! 이 부분을 이용해주세요 ^^

agdadfa · Answer

감사합니다!