Estoy tratando de realizar una operación de eliminación de axios en una tabla de arranque de reacción, pero recibo este error en la consola
DELETE http://localhost:9000/api/terminals/[object%20Object] Uncaught (in promise) Error: Request failed with status code 400estos son los codigos
constante
const apiUrl = 'api/terminals';UseState y UseEffect
const [data, setData] = useState([]); useEffect(() => { getData(); }, []); const getData = () => { axios(apiUrl).then(res => { setData(res.data); }); };Eliminar Axios
const handleDelete = rowId => { axios.delete(`${apiUrl}/${rowId}`).then(() => setData(data)); };Contenido modal
const ModalContent = () => { return ( <> <Modal show={showModal} onHide={handleClose}> <Modal.Header closeButton> <Modal.Title>Confirm delete operation</Modal.Title> </Modal.Header> <Modal.Body>Are you sure you want to delete this Terminal? </Modal.Body> <Modal.Footer> <Button variant="secondary" onClick={handleClose}> Cancel </Button> <Button onClick={id => handleDelete(id)}>Confirm</Button> </Modal.Footer> </Modal> </> ); };jsx principal con tabla de arranque
<> <BootstrapTable keyField="id" data={data} columns={columns} striped hover condensed pagination={paginationFactory()} cellEdit={cellEdit} filter={filterFactory()} noDataIndication="Table is Empty" /> {showModal ? <ModalContent /> : null} </>Utiliza un objeto en lugar de una cadena en la URL de eliminación. Normalmente obtienes un evento de onClick y no de la identificación. Si obtiene la identificación de otro lugar en el código que no muestra, puede intentar esto.
<Button variant="primary" onClick={() => handleDelete(id)}> Confirm </Button>