Tengo un problema con axios.post enviando dos veces la misma solicitud con el mismo cuerpo. He intentado buscar en Google el problema pero no encuentro nada. ¿Cómo puedo arreglarlo?

Aplicación.js

 import logo from './logo.svg'; import './App.css'; import Register from "./register"; import SendToken from "./sendToken"; import {BrowserRouter, Routes, Route} from "react-router-dom"; import Confirmation from "./Confirmation"; import {useParams} from "react-router-dom"; function App() { return ( <BrowserRouter> <div> <Routes> <Route path="/registration" element={<Register/>}/> <Route path="/confirmation" element={<Confirmation/>}/> <Route path="/account/registrationConfirm/:data" element={<SendToken/>}/> </Routes> </div> </BrowserRouter> ); } export default App;

enviarToken.js

 import axios from 'axios'; const SendToken = () => { let parts = window.location.href.split('/'); let length = parts.length; let token = parts[length - 1] == '' ? parts[length - 2] : parts[length - 1] axios.post("http://localhost:8080/api/v1/registration/registrationConfirm", {token}).then((data) => { console.log(data.status) console.log(data.data) console.log(token); } }).catch(() => { alert("An error occurred on the server") }) return ( <div> Token send </div> ) } export default SendToken;