Я использую SectionList для отображения списка данных.У меня есть главное меню, в котором пользователи могут нажимать эти кнопки, чтобы отобразить в списке другой набор данных, воспринимать его как вкладки.Все это работает нормально, отображаются правильные данные и обновляется должным образом.
Однако проблема в том, что когда пользователь прокручивает список, скажем, наполовину, в списке, затем нажимает одну из кнопок в верхней части окна.В списке больше не отображается анимация refreshing
(вращающийся круг).Я правильно реализовал свойство refreshing
, и оно работает всякий раз, когда я опускаюсь, чтобы обновить.
Также, если вы прокрутите до верхней части списка, затем нажмите одну из кнопок, значок обновления также отобразится, как и предполагалось.Проблема в том, что когда вы прокручиваете список вниз и затем устанавливаете свойство refreshing
, в списке не отображается значок.
<SectionList
refreshing={this.state.isFetching}
onRefresh={() => this.onRefreshList()}
....
...
/>
Затем, когда я звоню, я начинаю обновлять данные ...
this.setState({ isFetching: true }, function() {
....
....
//all code in here works fine the list shows activity monitor no problems
//when you scroll down on the list THEN
//call this the activity monitor can't be seen on the list
});
Поэтому, чтобы противодействовать этому, я попытался автоматически прокрутить вверх , прежде чем вызывать мое реальное обновление.Это вроде работает, но выглядит очень плохо.Обратного вызова нет, поэтому я не знаю, когда список завершил прокрутку к началу.
//this also works properly and scrolls the list to the top but
//it's really jumpy and looks terrible because the data is immediately
//replaced while it's scrolling to the top, the loading animation can't be seen.
this.sectionListRef.scrollToLocation({
animated: true,
sectionIndex: 0,
itemIndex: 0,
viewPosition: 0
});
Это известная проблема?Есть какие-то обходные пути или я просто что-то здесь не так делаю?