Uncaught (in promise) Error: Request failed with status code 405 VUEJS - laravel

Question

so i'm trying to consume an api form laravel via vue.js this is the login page were i did call axios.post :
<template>
<main>
<section class="login-content">
<div class="container h-100">
<div
class="row align-items-center justify-content-center h-100"
>
<div class="col-12">
<div class="row align-items-center">
<div class="col-lg-6">
<h2 class="mb-2">Sign In</h2>
<p>
To Keep connected with us please login with
your personal info.
</p>
<form>
<div class="row">
<div class="col-lg-12">
<div
class="floating-label form-group"
>
<input
class="floating-input form-control"
type="email"
v-model="data.email"
placeholder=" "
/>
<label>Email</label>
</div>
</div>
<div class="col-lg-12">
<div
class="floating-label form-group"
>
<input
class="floating-input form-control"
type="password"
v-model="data.password"
placeholder=" "
/>
<label>Password</label>
</div>
</div>
<div class="col-lg-6">
<div
class="custom-control custom-checkbox mb-3"
>
<input
type="checkbox"
class="custom-control-input"
id="customCheck1"
/>
<label
class="custom-control-label"
for="customCheck1"
>Remember Me</label
>
</div>
</div>
<div class="col-lg-6">
<a
href="auth-recoverpw.html"
class="text-primary float-right"
>Forgot Password?</a
>
</div>
</div>
<button
type="sumbit"
class="btn btn-primary"
#click="login" :disabled="isLogging" :loading="isLogging"
>
Sign In
</button>
<p class="mt-3">
Create an Account
<router-link to="/" exact
>Sign Up</router-link
>
</p>
</form>
</div>
<div class="col-lg-6 mb-lg-0 mb-4 mt-lg-0 mt-4">
<img
src=" asset (html/assets/images/login/01.png)"
class="img-fluid w-80"
alt=""
/>
</div>
</div>
</div>
</div>
</div>
</section>
</main>
</template>
<script>
export default {
data() {
return {
data: {
email: "",
password: ""
},
isLogging: false
};
},
methods: {
async login() {
if (this.data.email == "") return alert("Email is required")
if (this.data.password == "") return alert("Password is required")
/* if(this.data.password.length<6) return this.e ('Incorrect') */
this.isLogging = true
const axios = require('axios')
const headers = {
"Access-Control-Allow-Origin": "*",
"Access-Control-Allow-Method": "POST",
"Content-Type": "application/json",
}
axios.post('http://127.0.0.1:8000/?#/login/',{
email: this.email, password: this.password
}, headers)
.then((response)=>{
const data=response.data;
console.log(data);
})
this.isLogging = false
}
},
mounted() {
console.log("Component mounted.");
}
};
</script>
the step of confirmation : email and password are working well but i got the error when i press the button
and this is the login page as u can see : this is the login page as u can see
i was follwing this tuto but like always i had error unlike the man in the tuto this is the link of the tuto
and this is the route :
Route::post('login', 'App\Http\Controllers\Api\AuthController#login');