Recyclerlisview not show new data

[databasemanager0]

Hello,

I have an array. If new datas come in the array the recyclerlistview show not the new data only the old one. But Why ?

`import React, { useState, useEffect, forwardRef, memo } from 'react'; import { StyleSheet, Text, TextInput, View, TouchableOpacity, Image, Dimensions } from 'react-native'; import { TouchableWithoutFeedback } from 'react-native-gesture-handler'; import { RecyclerListView, LayoutProvider, DataProvider } from 'recyclerlistview'; import { useSelector, useDispatch } from 'react-redux'; import { AntDesign } from '@expo/vector-icons'; import { addAmountOnCartItem } from '../../../redux/slice/product/shopping_cart'; import faker from 'faker'; import ButtonWithoutLoader from '../../ButtonWithoutLoader';

const { width, height } = Dimensions.get('window');

const Shopping_cart_list = ({ datas }) => { const dispatch = useDispatch();

const [update, updateRecycler] = useState(false);

const handleChange = (e, product_id) => { dispatch(addAmountOnCartItem({ value: e, product_id })); updateRecycler(prevState => !prevState); };

const [dataProvider, setDataProvider] = useState(new DataProvider((r1, r2) => r1 !== r2).cloneWithRows(datas));

const [layoutProvider, setLayoutProvider] = useState( new LayoutProvider((i) => { return dataProvider.getDataForIndex(i).type; }, (type, dim) => { switch(type) { case 'NORMAL': dim.height = 250; dim.width = width * 0.9; break; default: dim.height = 0; dim.width = 0; break; } }) );

const rowRenderer = (type, data) => { const { product_id, product_name, price, product_image, amount, username } = data.item; return ( <TouchableWithoutFeedback style={{height: 250, backgroundColor: '#fff'}}>

{ username }

    <View style={styles.mainContainer}>
      <Image source={{uri: product_image}} style={styles.image} />
      <View>
        <Text style={styles.text}>{product_name}</Text>
        <Text style={styles.text}>Preis: {price}</Text>
        <View style={{flexDirection: 'row', alignItems: 'center'}}>
          <Text style={styles.text}>Anzahl: </Text>
          <AntDesign name="minussquareo" style={{marginRight: 6}} size={24} color="black" />
          <TextInput value={amount.toString()} onChangeText={e => handleChange(e, product_id)} style={{height: 28, width: 28, borderRadius: 4, textAlign: 'center', backgroundColor: '#eee'}} />
          <AntDesign name="plussquareo" style={{marginLeft: 6}} size={24} color="black" />
        </View>
      </View>
    </View>
    <View style={[styles.header, { marginTop: 4 }]}>
      <ButtonWithoutLoader onPress={() => updateRecycler(prevState => !prevState)} title="Jetzt Kaufen!" width={width * 0.9} />
    </View>
  </TouchableWithoutFeedback>
)

};

return ( <View style={{flex: 1}}> <RecyclerListView dataProvider={dataProvider} layoutProvider={layoutProvider} rowRenderer={rowRenderer} style={{marginLeft: width 0.05, marginRight: width 0.05}} extendedState={update} scrollViewProps={{showsVerticalScrollIndicator: false}} /> ) };`

[mathias-berg]

As far as I can see, you are not updating your dataProvider.

You should be doing something like this to update it.

useEffect(() => { setDataProvider(currentDataProvider => currentDataProvider.cloneWithRows(datas)); }, [datas]);