react-native - Unable to delete item from redux store, payload is a long list of strings

Question

I'm trying to delete an item from the store using useDispatch from redux. However the payload which is sent through via action is undefined. Here is my reducer:

export const DELETE_ITEM = 'DELETE_ITEM';
    
case DELETE_ITEM:
      return {
        ...state,
        items: state.items.filter((item, item_code) => item_code !== payload),
      };

And Here is my action:

//delete items
export const deleteItemAction = (item_code) => {
  return {type: DELETE_ITEM, payload: item_code};
};

And Finally my function & component

const dispatch = useDispatch();
const delete_item = (item_code: any) => {
    dispatch(deleteItemAction({item_code: item_code}));
    console.log(item_code);
};

  <FlatList
       data={items}
       keyExtractor={items.item_code}
       renderItem={({item}) => (
         <View>
           <Text>{item.item_id}</Text>
           <Text>{item.item_type}</Text>
           <Text>{item.item_code}</Text>
           <Text>{item.item_description}</Text>
           <Text>{item.cost_price}</Text>
           <Text>{item.quantity}</Text>
           <Text>{item.selling_price}</Text>
          <View>
             <Button title="Delete" onPress={delete_item} />
              <Button title="Edit" onPress={() => {}} />
           </View>
       </View>
    )}
  />

标签： react-nativereact-redux

Answer 1

I've found a temporary fix,

<Button title='Delete' onPress={() => {
   dispatch(deleteItemAction(item.item_code));
}}