Vue项目中Axios请求报错$http is undefined如何解决？

Vue项目中使用Axios发起HTTP请求时，遇到$http is undefined错误的解决方法

在Vue.js项目开发中，Axios是常用的HTTP客户端库。然而，许多开发者在使用$http进行网络请求时，可能会遇到$http is undefined的错误。本文将分析此错误的原因并提供相应的解决方案。

问题描述：

开发者在使用await $http.get(“api.cart”)时，遇到$http is undefined错误。尝试过配置jQuery，但问题依然存在。

立即学习“前端免费学习笔记（深入）”；

问题分析及解决方法：

错误信息$http is undefined表明JavaScript引擎找不到名为$http的变量或函数。这通常是因为未正确引入或定义$http。

$http并非Vue.js内置API，Vue.js本身不提供名为$http的全局对象。许多开发者习惯将Axios实例赋值给$http，但直接使用$http要求它在当前作用域内已声明。

因此，解决方法主要有两种：

正确引入并赋值： 使用import语句引入Axios，并将其赋值给一个变量（建议使用更具描述性的名称，避免与其他库冲突）。

import axios from 'axios';const http = axios; // 将axios赋值给httpasync function fetchData() {    let res = await http.get("api.cart");    // ... 处理res ...}

登录后复制