React-nativesectionList всегда прокручивается до первого раздела, если индекс элемента равен 0, независимо от индекса раAndroid

Форум для тех, кто программирует под Android
Ответить Пред. темаСлед. тема
Anonymous
 React-nativesectionList всегда прокручивается до первого раздела, если индекс элемента равен 0, независимо от индекса ра

Сообщение Anonymous »

Я использую РазделList в React Native для отображения нескольких разделов с несколькими элементами в каждом разделе. Я программно прокручиваю определенные разделы и элементы, используя метод ScrollToLocation.
Проблема, с которой я сталкиваюсь, заключается в том, что если я пытаюсь прокрутить до элемента с itemIndex, равным 0, список секций всегда прокручивается. к первому элементу первого раздела, независимо от предоставленного мной разделаIndex. Если itemIndex больше 0, прокрутка работает должным образом и переходит к правильному разделу и элементу. Проблема возникает в iOS. Вот упрощенный код для воспроизведения проблемы:

Код: Выделить всё

import React, { useRef } from 'react';
import {
SectionList,
View,
Text,
Button,
StyleSheet,
StatusBar,
} from 'react-native';

const App = () => {
const sectionListRef = useRef(null);

const sections = Array.from({ length: 10 }, (_, sectionIndex) => ({
title: `Section ${sectionIndex + 1}`,
data: Array.from(
{ length: 30 },
(_, itemIndex) => `Item ${sectionIndex + 1}.${itemIndex + 1}`
),
}));

const scrollToLocation = ({
sectionIndex,
itemIndex,
}: {
sectionIndex: number;
itemIndex: number;
}) => {
{
sectionListRef.current?.scrollToLocation({
sectionIndex,
itemIndex,
viewPosition: 0.5, // Center the item in the view
});
}
};

const onScrollFail = (info: any) => {
console.log('Failed to scroll, retrying', info);
setTimeout(() => {
scrollToLocation({ sectionIndex: 0, itemIndex: info.index });
}, 500);
};

return (


 scrollToLocation({ sectionIndex: 0, itemIndex: 0 })}
/>
 scrollToLocation({ sectionIndex: 3, itemIndex: 0 })}
/>

 item + index}
renderItem={({ item }) => (

{item}

)}
renderSectionHeader={({ section }) => (

{section.title}

)}
onScrollToIndexFailed={onScrollFail}
/>

);
};

const styles = StyleSheet.create({
container: {
flex: 1,
padding: 10,
paddingTop: 50,
},
buttonsContainer: {
flexDirection: 'row',
justifyContent: 'space-between',
marginBottom: 10,
},
item: {
padding: 15,
backgroundColor: '#f9f9f9',
borderBottomWidth: 1,
borderBottomColor: '#ddd',
},
header: {
padding: 10,
backgroundColor: '#e0e0e0',
},
headerText: {
fontWeight: 'bold',
},
});

export default App;

Это также можно протестировать на выставке-закуске.

Подробнее здесь: https://stackoverflow.com/questions/792 ... index-is-0
Реклама
Ответить Пред. темаСлед. тема

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

  • Похожие темы
    Ответы
    Просмотры
    Последнее сообщение

Вернуться в «Android»