“Gulir ke bawah reaksi div” Kode Jawaban

bereaksi gulir ke bawah 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

Gulir ke bawah reaksi div

// 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

Jawaban yang mirip dengan “Gulir ke bawah reaksi div”

Pertanyaan yang mirip dengan “Gulir ke bawah reaksi div”

Lebih banyak jawaban terkait untuk “Gulir ke bawah reaksi div” di JavaScript

Jelajahi jawaban kode populer menurut bahasa

Jelajahi bahasa kode lainnya