/Javascript/React/Scrollbar automatically scroll down as new divs are added reactjs

Scrollbar automatically scroll down as new divs are added reactjs

import React, { useEffect, useRef } from 'react'

const Messages = ({ messages }) => {

  const messagesEndRef = useRef(null)

  const scrollToBottom = () => {
    messagesEndRef.current.scrollIntoView({ behavior: "smooth" })
  }

  useEffect(scrollToBottom, [messages]);

  return (
    <div>
      {messages.map(message => <Message key={message.id} {...message} />)}
      <div ref={messagesEndRef} />
    </div>
  )
}

Source: xspdf.com

Similar codes

0 vote417 views1 answer
./node_modules/react-draft-wysiwyg/dist/react-draft-wysiwyg.js
Javascript React
0 vote374 views1 answer
Reactive forms angular conditional disabling
Javascript React
0 vote383 views1 answer
React native run android common error
Javascript React
1 vote379 views1 answer
Webpack-bundle-analyzer react
Javascript React
0 vote391 views1 answer
Make image circle css react
Javascript React
0 vote410 views1 answer
React native geocoding
Javascript React
0 vote390 views1 answer
React native gridient button
Javascript React
1 vote384 views1 answer
Rendering, reconciliation, committing in react
Javascript React
13 votes395 views1 answer
React making post request
Javascript React
0 vote369 views4 answers
React native biometrics sign in
Javascript React