axios （用法、传参等）

1、概念：

是一个专注于网络请求的库。

2、网址：

中文官网地址: http://www.axios-js.com/ 可直接点击这里跳到中文官网

英文官网地址: https://www.npmjs.com/package/axios 可直接点击这里跳转到英文官网

3、基础语法：

4、使用：

直接引入

然后在全局下就有这个方法了

5、基础语法示例：

结果：

结论：调用 axios 方法得到的返回值是 Promise 对象

然后 Promise 对象就可以用 .then 等方法了，如下图：

打印 books 的结果如下：
里面有6个属性

用 Postman（测试接口数据的）去检测，服务器返回的结果如下图，只有3个属性

展开 data 属性，里面有3个属性，和 Postman 里面测试的结果一致，因此服务器返回的数据都在 data 里面，而我们需要的数据是 data.data

放一张图，帮助理解

6、传参：

一：GET 传参

结果如下：

二：POST 传参

结果如下：

7、async await：

由上面的分析，我们可以看到用 .then 比较麻烦
优化如下：

结果如下：

注:

• 如栗调用某个方法的返回值是 Promise 实例,则前面可以添加 await
• await 只能用在被 async “修饰”的方法中

8、解构赋值+冒号重命名：

对应上面的第5点，怎样拿到我们真正需要的data里面的数据呢？（即上面提到的 data.data）

解构出来的 data 结果如下：

这里拿到的数据就是服务器里面的数据(有3个属性)，但是我们需要的数据是 data 属性里面的数据 data （即data.data），怎么办？如下：

完整代码如下：

<!DOCTYPEhtml><htmllang="en">