Axios介绍与使用(一)

Axios介绍

1、Axios是什么?

  • Axios是一个基于promise的HTTP库,类似于jQuery的ajax,用于http请求。可以应用于浏览器端和node.js,既可以用于客户端,也可以用于node.js编写的服务端。

2、Axios特性

  • (1)支持Promise API

  • (2)拦截请求与响应,比如:在请求前添加授权和响应前做一些事情。

  • (3)转换请求数据和响应数据,比如:进行请求加密或者响应数据加密。

  • (4)取消请求

  • (5)自动转换JSON数据

  • (6)客户端支持防御XSRF

3、浏览器支持情况

  • Firefox、Chrome、Safari、Opera、Edge、IE8+

Axios使用

  • vue创建项目 vue create axios-vue,选择自定义配置manually select features,终端显示如下:上下键切换,空格键选择对应配置。
    在这里插入图片描述
    而后,我们一次选择一下配置:
    在这里插入图片描述
    运行终端指令 cd axios-vue 、npm run serve启动项目后,运行终端指令npm add axios安装axios,至此,项目创建完成,axios安装完成。

在项目的public文件夹下新建data.json文件,用于模拟数据。在组建中引入axios,并发起请求。

{
    
    
    "title":"vue project",
    "create_time":"2019-01-01"
}

在组件中中,引入axios并使用。

import axios from "axios"
 
 
axios.get("/data.json").then(res=>{
    
    
    console.log(res)
}).catch(err=>{
    
    
    console.log(err)
})

此时,已经可以请求掉数据了,效果如下:
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/qq_52151772/article/details/114397591
今日推荐