I want to be able to delete items of a list fetched from MongoDB.

Items of an array of the list are retrieved from MongoDB and displayed in React app (I use Typescript).

Unfortunately, I get error HERE I get error Argument of type '{ itemId: any; }' is not assignable to parameter of type 'AxiosRequestConfig'

ExpensesListItem.tsx

import React from "react";

import { IconButton, ListItem, ListItemSecondaryAction, ListItemText } from "@material-ui/core";

import DeleteIcon from '@material-ui/icons/Delete';

import { ExpenseAndAmountObject } from '../ExpenseAndAmountObject';

import axios from 'axios';

interface Props {

    expenseTitle: string;

    expenseAmount: string;

    currencySymbol: string;

    item: ExpenseAndAmountObject;

    expenseAndAmountList: Array<ExpenseAndAmountObject>;

    setExpenseAndAmountList: (value: Array<ExpenseAndAmountObject>) => void;

  }



const ExpensesListItem: React.FC<Props> = (

    {

        expenseTitle,

        expenseAmount,

        currencySymbol,

        item,

        expenseAndAmountList,

        setExpenseAndAmountList

    }: Props) => {



        const DeleteListItem = (toBeDeletedItemId: any) => {

        setExpenseAndAmountList(expenseAndAmountList.filter(el => el._id !== toBeDeletedItemId));



        axios.delete('http://localhost:4000/app/expenseslist',{itemId:toBeDeletedItemId}) 

//HERE I GET THE ERROR Argument of type '{ itemId: any; }' is not assignable to parameter of type 'AxiosRequestConfig'

        .catch(function (error) {

            console.log(error);

        });

    }

    return (

        <>

            <ListItem className="list-item">

                <ListItemText primary={expenseTitle} secondary={expenseAmount + currencySymbol} />

                <ListItemSecondaryAction>

                    <IconButton onClick={()=>DeleteListItem(item._id)} edge="end">

                        <DeleteIcon className="delete-btn" />

                    </IconButton>

                </ListItemSecondaryAction>

            </ListItem>

        </>

      );

  }

  

export default ExpensesListItem;

routes.js

 router.delete('/expenseslist', (request, response) => {

    let itemId = request.body._id;

    ExpenseAndAmountTemplate.findByIdAndRemove(itemId, function(err){

        if(err){

            response.send("/Could not delete the item...");

        } else {

            response.send("/Expenses and amount item was deleted succesfully...");

        }

     });

 });

ExpenseAndAmountModel.js (This is the model used at router.delete)

const mongoose = require('mongoose');



const ExpenseAndAmountTemplate = new mongoose.Schema({

    _id: {

        type:String,

        required:false

    },

    expenseTitle: {

        type:String,

        required:true

    },

    expenseAmount: {

        type:String,

        required:true

    }

});



module.exports = mongoose.model('ExpenseAndAmountData', ExpenseAndAmountTemplate);

Do you know how to solve it? Thanks!