在前端开发中，与后台交互是必不可少的一部分。而在进行后台接口数据请求时，axios 是常用的请求库，它可以让我们更方便、更简单地发起请求。而我们在小程序开发时，也同样需要进行接口请求。为了解决小程序中的请求问题，我们可以使用 npm 包 wx-http-axios，它可以让我们在微信小程序中使用 axios 库。本文将带你详细了解如何使用该包，以及其使用的深度和指导意义。
什么是 wx-http-axios？
wx-http-axios 是一款可以在微信小程序中使用 axios 库的包。在小程序开发中，我们无法直接使用 axios 库，因为微信小程序是基于 JavaScript 的，包括浏览器、微信开发者工具等，均没有 Node.js 中的全局变量，以及浏览器中 Node.js 没有的 API，如 process、fs 等等。而使用 wx-http-axios 就可以解决这个问题。
安装
安装 wx-http-axios 很简单，只需要运行以下命令即可：
npm install wx-http-axios --save
使用方法
在写这篇文章之前，我们已经默认您已经掌握 axios 库的基础使用。如果不了解 axios 的用法，建议您先学习相关知识。
引入 wx-http-axios
在小程序的页面中，我们需要先引入 wx-http-axios，如下所示：
import axios from 'wx-http-axios';
发送请求
与 axios 一样，我们也可以使用 wx-http-axios 发送各种类型的请求，如 GET、POST、PUT、DELETE 等等。在发送请求之前，我们需要设置一些参数，以使用该包完成我们想要完成的请求任务。
在小程序中使用请求头
在小程序开发中，我们需要使用微信官方提供的接口发送网络请求，微信官方推出 wx.request() API，因此我们需要在使用 axios 时将请求头等信息转化为微信官方 API 支持的格式。具体引入方式如下所示：
-- -------------------- ---- -------
------ ----- ---- ----------------
------ --------- ---- -----------------
----- ---- - -----------
------
-------- -----------------------------
---
----- ------ - -
------- ------
---- ------------------
---------------- ------
-------- -
------------------- -----------------
------- -------------------
--------------- ------------------ ---------------
--
--
------------------------------- -- -
--------------------
---------------- -- -
---------------------
---上述代码中使用了 weixin-request 包，我们可以通过执行 wxRequest() 函数来进行请求。这个函数的参数包含 axios 配置和 baseURL。之后我们就可以像 axios 一样传递请求头、请求参数以及回调函数。
这里我们通过 config 配置，示例请求了一个 lodash 库。这是一个 GET 请求方式，它将在控制台输出请求结果。
在小程序中使用请求参数
在小程序开发中，我们需要向后台传递一些参数，这就需要 uss 发送请求到后台。与 axios 一样，我们可以使用 wx-http-axios 支持的.POST() 方法发送请求。具体方法如下：
-- -------------------- ---- ------- ----------------------------------- - ----- ----- ---- --- -- -------------- ---------- - ---------------------- -- --------------- ------- - ------------------- ---
上述代码中执行了一次 POST 请求，请求参数包含了 name 和 age 两个参数。回调函数中可以获取到请求结果。
其他方法
类似于 axios，wx-http-axios 还支持通过 .PUT()、.DELETE() 和 .GET() 方法发送请求。这些方法的使用与 .POST() 相似。例如，发送一个 .GET() 请求：
axios.get('http://localhost/api/')
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});总结
通过本文提供的学习和指导，相信您已经掌握了 wx-http-axios 的使用方法。在小程序开发中，使用该包能够更加方便、快速地完成接口数据请求。希望您能够通过本文学到有用的知识，提升自己的编程技能。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600671158dd3466f61ffe635