ReactNative - Медленное использование FlatList и Redux для обновления - PullRequest
Новая
       15

ReactNative - Медленное использование FlatList и Redux для обновления

0 голосов
/ 02 октября 2019

My FlatList отображает сообщение и имеет кнопку «Дополнительно» в правом нижнем углу. Нажмите кнопку More, чтобы увидеть дополнительные кнопки.

Я реализовал это, используя immutability-helper s update, но он замедляется при большом количестве данных (режим выпуска).

Это происходит только на плохо работающих устройствах. Медленно на iPhone 6 Это нормально для Galaxy S10.

Может ли быть другой хороший способ реализации ?? 

  [CHANGE_POST_EXPAND]: (state, action) => {
        const { index, expandState } = action.payload;
        return {
          ...state,
          postList: update(state.postList, {
            [index]: { isExpand: { $set: expandState } },
          }),
        };
      },


<SwipeListView
  disableRightSwipe
  style={{ backgroundColor: Colors.GRAY_LV0 }}
  data={postList}
  initialNumToRender={5}
  onEndReachedThreshold={0.5}
  onEndReached={onEndReached}
  refreshing={refreshing}
  onRefresh={onRefresh}
  renderItem={renderItem}
  keyExtractor={item => (item.postUID.toString())}
  contentContainerStyle={{ justifyContent: 'flex-start' }}
  automaticallyAdjustContentInsets={false}
  renderHiddenItem={({ item }) => (
    <TouchableWithoutFeedback
      style={{ justifyContent: 'center' }}
      onPress={() => hideItem(item.postUID)}
    >
      <View style={{
        alignSelf: 'flex-end',
        backgroundColor: Colors.GRAY_LV3,
        width: 75,
        height: '100%',
        justifyContent: 'center',
        borderBottomWidth: 2,
        paddingVertical: 5,
        borderBottomColor: Colors.GRAY_LV0,
      }}
      >
        <Text style={{
          color: Colors.GRAY_LV7,
          alignSelf: 'center',
          fontFamily: Fonts.NANUMGOTHIC,
          fontSize: addFontSize(14),
        }}
        >
          HIDE
        </Text>
      </View>
    </TouchableWithoutFeedback>
  )}
  rightOpenValue={-75}
/>

1 Ответ

0 голосов
/ 03 октября 2019

Я использовал Redux раньше. В больших проектах, в которых много древовидных компонентов. Это совсем нехорошо. Я нашел отличную альтернативу. Этот простой и высокопроизводительный документ - ЗДЕСЬ

...