Axios 的两种使用方法
Axios 的两种使用方法
axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端。axios本质上也是对原生XHR的封装，只不过它是Promise的实现版本，符合最新的ES规范。
它本身具有以下特征：
a.从浏览器中创建 XMLHttpRequest b.从 node.js 发出 http 请求 c.支持 Promise API e.拦截请求和响应 f.转换请求和响应数据 g.取消请求 h.自动转换JSON数据 i.客户端支持防止 CSRF/XSRF
在我们做项目编写文件代码的过程中，往往需要请求后台的数据，可以通过Axios方法实现，简单使用如下:
首先利用npm安装npm install axios --save
1、直接使用，以下代码为在Vue文件中的 methods 方法中定义的获取后台数据的方法
methods: {
// 连接后台获取数据的方法
getData () {
let params = {
lt: '20180411',
luzp: '20161122',
}
// /lt/luzp/luzplovelt 为后台接口
axios.post(`/lt/luzp/luzplovelt`, params).then(res => {
if (res.data.flag === 'SUCCESS') {
this.data = res.data.data
this.$message.success(res.data.msg)
} else {
this.$message.error(res.data.msg)
}
})
}
}复制代码2、在js文件中定义
<script>
// 引入接口的 js 文件
import { luzplt } from '../../../service/ration'
methods: {
// 连接后台获取数据的方法
getData () {
let params = {
lt: '20180411',
luzp: '20161122',
}
luzplove.lut(params).then(res => {
if (res.data.flag === 'SUCCESS') {
this.data = res.data.data
this.$message.success(res.data.msg)
} else {
this.$message.error(res.data.msg)
}
})
}
}
</script>复制代码把接口写到 js 文件中 luzplt.js
import axios from '../../../service/http'
export class luzplove{
// 查询信息
static lut(data) {
return axios.post(`/lt/luzp/luzplovelt`, data)
}
}
作者：蜗速前进ing
链接：https://juejin.cn/post/7020585652638973960