Основные технологии в игре: FlatList
React-Navigation 5
Redux
Redux-Thunk
.
Главная домашняя страница представляет собой поток сообщений (изображение, подпись, имя и т. Д. c.). В верхнем правом углу домашней страницы находится кнопка заголовка, которую я нажимаю на go на экране, где я могу создать сообщение. Вот где изображение, подпись или оба будут добавлены на мою домашнюю страницу.
Ниже приведен мой FlatList
код для справки. Я уже пытался установить removeClippedSubviews={false}
. Это не работает и фактически усугубляет проблему.
<FlatList
ref={flatListRef}
data={allPosts}
extraData={[isLoading, isRefreshing, allPosts]}
refreshControl={
<RefreshControl
refreshing={isRefreshing}
onRefresh={onRefresh}
/>
}
keyExtractor={item => item._id}
initialNumToRender={2}
renderItem={renderItem}
onEndReached={!endOfFeed && !oneTimeLoad && handleLoadMore}
onEndReachedThreshold={2}
ListFooterComponent={renderFooter}
ListHeaderComponent={renderHeader}
removeClippedSubviews={true} // Best way to optimize but sacrifices fast scroll down with blank space
//getItemLayout={(data, index) => ({ length: POST_CARD_HEIGHT, offset: POST_CARD_HEIGHT * index, index})}
//windowSize={20}
//maxToRenderPerBatch={15}
//updateCellsBatchingPeriod={50}
/>
Мой стековый навигатор работает так, как показано до того, как я нажимаю "Отправить сообщение": HomeScreen
=> CreatePostScreen
. Нажатие кнопки «Отправить» в CreatePostScreen
отправляет действие, которое делает вызов API
на мой внутренний сервер. Создает сообщение, возвращает назад созданные данные сообщения, включая изображение uri
и другие metadata
, а затем обновляет мое избыточное состояние, добавляя вновь созданное сообщение к старому состоянию.
Затем я вызываю navigation.pop()
возвращая меня к HomeScreen
. Когда я вижу это снова, меня встречает сообщение со всеми соответствующими данными, за исключением того, что NO показывает изображение. Я вижу это только в том случае, если прокручиваю вниз там, где оно не видно, а затем возвращаюсь к нему.
Любые идеи будут полезны.