XiaoMo/ChatGPT-Next-Web
1
0
Fork 1
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

Merge pull request #2117 from JunJD/优化useScrollToBottom

Browse Source 
refactor: 优化 useScrollToBottom
This commit is contained in:
Yifei Zhang 2023-06-24 22:25:45 +08:00 committed by GitHub
commit fb82806956
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
app/components/chat.tsx
View File

@ -3,8 +3,8 @@ import React, {
useState, useState,
useRef, useRef,
useEffect, useEffect,
useLayoutEffect,
useMemo, useMemo,
useCallback,
} from "react"; } from "react";
import SendWhiteIcon from "../icons/send-white.svg"; import SendWhiteIcon from "../icons/send-white.svg";
@ -341,15 +341,15 @@ function useScrollToBottom() {
// for auto-scroll // for auto-scroll
const scrollRef = useRef<HTMLDivElement>(null); const scrollRef = useRef<HTMLDivElement>(null);
const [autoScroll, setAutoScroll] = useState(true); const [autoScroll, setAutoScroll] = useState(true);
const scrollToBottom = () => { const scrollToBottom = useCallback(() => {
const dom = scrollRef.current; const dom = scrollRef.current;
if (dom) { if (dom) {
setTimeout(() => (dom.scrollTop = dom.scrollHeight), 1); requestAnimationFrame(() => dom.scrollTo(0, dom.scrollHeight));
} }
}; }, []);
// auto scroll // auto scroll
useLayoutEffect(() => { useEffect(() => {
autoScroll && scrollToBottom(); autoScroll && scrollToBottom();
}); });