Улучшенный метод отслеживания изменения высоты для скроллинга
This commit is contained in:
@@ -74,25 +74,25 @@ export function Messages() {
|
||||
return () => observer.disconnect();
|
||||
}, [messages.length, loading]);
|
||||
|
||||
// MutationObserver - отслеживаем изменения контента (загрузка картинок, видео)
|
||||
useEffect(() => {
|
||||
if (!contentRef.current) return;
|
||||
if (!contentRef.current || !viewportRef.current) return;
|
||||
|
||||
const observer = new MutationObserver(() => {
|
||||
// Скроллим только если нужен авто-скролл
|
||||
if (shouldAutoScrollRef.current) {
|
||||
const contentEl = contentRef.current;
|
||||
//const viewportEl = viewportRef.current;
|
||||
let lastHeight = contentEl.scrollHeight;
|
||||
|
||||
const ro = new ResizeObserver(() => {
|
||||
const newHeight = contentEl.scrollHeight;
|
||||
const grew = newHeight > lastHeight;
|
||||
lastHeight = newHeight;
|
||||
|
||||
if (grew && shouldAutoScrollRef.current) {
|
||||
scrollToBottom(true);
|
||||
}
|
||||
});
|
||||
|
||||
observer.observe(contentRef.current, {
|
||||
childList: true,
|
||||
subtree: true,
|
||||
attributes: true,
|
||||
attributeFilter: ['src', 'style', 'class']
|
||||
});
|
||||
|
||||
return () => observer.disconnect();
|
||||
ro.observe(contentEl);
|
||||
return () => ro.disconnect();
|
||||
}, [scrollToBottom]);
|
||||
|
||||
// Первый рендер - скроллим вниз моментально
|
||||
|
||||
Reference in New Issue
Block a user