Я пытаюсь использовать метод scrollToEnd() в VirtualizedList. Но что интересно, я не могу найти в Интернете ни одного примера, объясняющего, как использовать методы с VirtualizedList.
Я пытался использовать его, как показано ниже, но, очевидно, это не сработало.
<VirtualizedList
data = {serverData}
initialNumToRender = {4}
renderItem = {renderItem}
keyExtractor = {item => item.id.toString()}
getItemCount = {getItemCount}
getItem = {getItem}
ListFooterComponent = {renderFooter}
scrollToEnd = {{ animated: true }}
/>
VirtualizedList
выставлять scrollToEnd
метод, а не реквизит. Вы должны использовать React Ref для доступа к нему.
const listRef = React.useRef(null)
// Scroll to list end - Call this function after add new items to list for example
const scrollToListEnd = ()=> listRef.current?.scrollToEnd({ animated: true })
<VirtualizedList
data = {serverData}
initialNumToRender = {4}
renderItem = {renderItem}
keyExtractor = {(item) => item.id.toString()}
getItemCount = {getItemCount}
getItem = {getItem}
ListFooterComponent = {renderFooter}
ref = {listRef}
/>;
Этот не работает
Функция scrollToEnd
наследуется от ScrollView
посредством VirtualizedList
. Это функция, а не реквизит.
Вам нужно создать ссылку на компонент списка и вызвать функцию, используя эту ссылку. Это можно сделать следующим образом.
const listRef = useRef(null);
<VirtualizedList
ref= {listRef}
onContentSizeChange= {()=> listRef.current.scrollToEnd()}
/>
Приведенный выше код прокручивается до конца списка при изменении размера содержимого его данных. Однако вы можете вызывать функцию scrollToEnd
в любое время.
проверить новое решение