You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Vue3+SpringBoot项目axios.get报错:error不是函数问题求助

问题描述

我正在开发一个前端基于Vue3、后端基于SpringBoot的项目,使用axios发送HTTP请求。每次调用axios.get接口时,控制台会抛出错误:

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

尽管API调用仍能正常触发,后端功能也运行正常,但该错误始终存在。我尝试过使用Chrome插件关闭CORS,但问题未解决。以下是我的代码:

<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>
解决方案

错误的核心原因是:axios的Promise链式调用没有.error()方法,正确的错误捕获方法是使用.catch()。

只需将代码中的.error((error)=>console.log(error))替换为.catch((error)=>console.log(error)),即可消除该错误。

修改后的关键代码片段:

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

内容的提问来源于stack exchange,提问作者Aditya

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.21 14:25:00