Uncaught TypeError: axios__WEBPACK_IMPORTED_MODULE_1__.default.get(...).then(...).error is not a function

I am trying to build a project in vue 3 for frontend and spring boot in backend. I am using axios to send request but whenever I call axios.get this error pops up but the api call is till being made and the backend function is performing well.But this error is haunting me, I am confused how to solve it. Please help!! error from console enter image description here

<template>
  <div class="text-center"><h1 class="text-bg-dark">User Registration</h1></div>
  <div>
    <form class="form-control text-center" @submit.prevent="register">
      <label for="userEmail">Enter your email:</label><br />
      <input
        type="email"
        name="userEmail"
        id="userEmail"
        class="border-3"
        v-model.lazy="dt.userEmail"
      /><br />
      <label for="userPassword">Enter your password:</label><br />
      <input
        type="password"
        name="userPassword"
        id="userPassword"
        v-model.lazy="dt.userPassword"
      /><br />
      <label for="confirmPassword">Enter your password again:</label><br />
      <input
        type="password"
        name="confirmPassword"
        id="confirmPassword"
        v-model.lazy="dt.confirmPassword"
      /><br />
      <label for="userNumber">Enter Contact Number</label><br />
      <input type="number" id="userNumber" v-model.lazy="dt.userNumber" /><br />
      <label for="userAddress">Enter your Address</label><br />
      <input
        type="text"
        id="userAddress"
        v-model.lazy="dt.userAddress"
      /><br />
      <label for="userCity">Pincode</label><br />
      <input type="number" id="userCity" v-model.lazy="dt.userCity" /><br />
      <br />
      <button type="submit">Submit</button>
    </form>
  </div>


  <div>
    <otpVerify v-if="registered" :email="dt?.userEmail" @back="back" />
  </div>
</template>

<script>
import axios from "axios"
import otpVerify from '../components/otpVerify.vue'
export default {
  components:{
    otpVerify
  },
  data() {
    return {
      registered: false,
      dt: {
        userEmail: "",
        userPassword: "",
        confirmPassword: "",
        userNumber: "",
        userAddress: "",
        userCity: "",
      },
    };
  },
  methods: {
    back(){
      this.registered=false;
    },
    register() {
      if (
        this.dt.userEmail == "" ||
        this.dt.userPassword == "" ||
        this.dt.confirmPassword == "" ||
        this.dt.userNumber == "" ||
        this.dt.userAddress == "" ||
        this.dt.userCity == ""
      ) {
        alert("Please fill all the fields");
      } else {
        if (this.dt.userPassword == this.dt.confirmPassword) {
          axios.get(`http://localhost:6969/sendmail/${this.dt.userEmail}`)
          .then((response)=>console.log(response))
          .error((error)=>console.log(error));
          this.registered= !this.registered;
        } else {
          alert("Passwords do not match");
        }
      }
    },
  },
};
</script>

<style></style>

I tried to turn off cosr from crome extension

The error you're encountering is due to a typo in your code. The correct function to handle errors in axios is .catch() rather than .error(). Example:

axios.get(`http://localhost:6969/sendmail/${this.dt.userEmail}`)
.then((response)=>console.log(response))
.catch((error)=>console.log(error));

If you are wondering why it is working despite the error, it's because your request goes through and you receive a successful response, which leads you to the .then() statement, yet you still get the error.