“reaccionar desplazamiento al fondo de div” Código de respuesta

reaccionar desplazamiento al fondo de div

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>
  )
}
Clear Copperhead

desplazarse a la parte inferior de un elemento reaccionar

// without smooth-scroll
const scrollToBottom = () => {
		divRef.current.scrollTop = divRef.current.scrollHeight;
};

//with smooth-scroll
const scrollToBottomWithSmoothScroll = () => {
   divRef.current.scrollTo({
        top: divRef.current.scrollHeight,
        behavior: 'smooth',
      })
}

scrollToBottom()
scrollToBottomWithSmoothScroll()
Inquisitive Iguana

Respuestas similares a “reaccionar desplazamiento al fondo de div”

Preguntas similares a “reaccionar desplazamiento al fondo de div”

Más respuestas relacionadas con “reaccionar desplazamiento al fondo de div” en JavaScript

Explore las respuestas de código populares por idioma

Explorar otros lenguajes de código