Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6287

React Native - Flatlist error when removing an item

$
0
0

I am using flatlist to display a list of items from async storage. I am currently getting the list of items from async storage and then displaying it using flatlist so removing an item item from the flatlist also removes it from the async storage.

The list of items (ItemsArray) consists of id and product retrieved from async storage.

When i try to remove a single item from the list i get an error as shown here:Error 1Error 2

Error 1 happens because the items are being compared so it can sort the list in ascending order and when the item is removed, there is no item to be compared with so it returns null.

Error 2 happens when i remove the last item from the list and i believe the error is related to the key extractor.

Async Storage: https://react-native-async-storage.github.io/async-storage/docs/api#removeitem

Code:

const [ItemArray, setItemsArray] = useState([]);const removeItem = async (ID) => {  await AsyncStorage.removeItem(ID);};const getItem = async (x) => {  const item = await AsyncStorage.getItem(x);  return item};const getAllItems = async () => {  let temp = [];  temp = await AsyncStorage.getAllKeys();  const tempItems = [];  for (let i = 0; i < temp.length; i++) {    tempItems.push(await getItem(temp[i]));  }  setItemsArray(tempItems);};//...return (<View><FlatList      data={itemsArray.sort((a, b) => (a.id > b.id ? 1 : -1))}      renderItem={renderItem}      keyExtractor={(product) => product.id}    /></View>);

Viewing all articles
Browse latest Browse all 6287

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>