Wie bekomme ich eine NextUI ListBox, um zum letzten ListItem zu scrollen?
Posted: 03 Jan 2025, 04:52
Einige Hintergrundinformationen: Ich versuche, einen Nachrichten-Chat-Feed zu erstellen.
Ich habe eine NextUI ListBox-Komponente mit der Eigenschaft isVirtualized und den entsprechenden Parameter. Es wird wie folgt erstellt:
Und der ListboxWrapper:
Die Elemente der Liste werden dynamisch geladen. Ich möchte, dass das letzte Element in der Liste immer am Ende des enthaltenden Div steht.
Ich habe derzeit:
Was nach oben scrollt. Es scheint egal zu sein, welchen Block ich setze ( oder start), das Verhalten ist das gleiche. Mache ich etwas falsch oder gibt es einen einfacheren Weg, dies zu tun?
Ich hatte die gleichen Ergebnisse mit document.getElementById(..).scrollIntoView(..). Ich habe auch den Verweis auf das letzte Listenelement verschoben, aber wenn ich das mache, erscheint das letzte Listenelement oben im Container und die anderen Elemente sind nicht sichtbar und können nicht gescrollt werden.
Vielen Dank im Voraus!
Ich habe eine NextUI ListBox-Komponente mit der Eigenschaft isVirtualized und den entsprechenden Parameter. Es wird wie folgt erstellt:
Code: Select all
{(item) => (
{item.text}
)}
Code: Select all
const ListboxWrapper = ({children}) => (
{children}
);
Ich habe derzeit:
Code: Select all
const scrollToBottom = () => {
messagesEndRef.current?.scrollIntoView({behavior: 'smooth' , block: 'end'})
}
Code: Select all
end
Ich hatte die gleichen Ergebnisse mit document.getElementById(..).scrollIntoView(..). Ich habe auch den Verweis auf das letzte Listenelement verschoben, aber wenn ich das mache, erscheint das letzte Listenelement oben im Container und die anderen Elemente sind nicht sichtbar und können nicht gescrollt werden.
Vielen Dank im Voraus!