【记录6】axios常见的四种请求方式_axios请求放肆

今天小编写点axios的一些简单基本用法。
想必大家都知道前端在数据交互方面，主要流行于JavaScript和axios两种，JavaScript既可以用于事件的交互，也可以用于操作dome，当然用于操作demo方面居多；而axios主要用于事件交互，也是在建立于JavaScript之后。下面小编主要介绍axios的几种请求方式的写法。

axios

axios是一个基于promise的HTTP库，可以用在浏览器和node.js中。小编主要是通过代码来说明它的简单使用方法。

下载方法： npm install axios

1. get

const params = {这里放的是一些参数，主要将这些参数携带在url之后传给后端}
const config = { 这里存放的是有关请求头的一些参数，例如：token }
axios.get(url,params，config).then(res => {
    console.log("axios的get请求方法")
} )
1
2
3
4
5

//案例：查找年龄在50~18之间的人员信息
const params = { max:"50",min:"18" }
const config = { token : "difdhiohfhf7gfgsfs5468f8eqg" }
axios.get(url,parmas,config).then(res => {
    console.log("get")
} )
1
2
3
4
5
6

2. post

const params = {这里放的是一些参数，主要将这些参数携带在url之后传给后端}
const config = { 这里存放的是有关请求头的一些参数，例如：token }
axios.post(url,params，config).then(res => {
    console.log("axios的get请求方法")
} )
1
2
3
4
5

//案例：管理员为姓名为王少，手机号为132********的人注册账号
const params = { name:"王少",phone:"132********" }
const config = { token : "difdhiohfhf7gfgsfs5468f8eqg" }//这里的token来自管理员登录成功后获得的token
axios.post(url,parmas,config).then(res => {
    console.log("get")
} )
1
2
3
4
5
6

3. delete

const params = {这里放的是一些参数，主要将这些参数携带在url之后传给后端}
const config = { 这里存放的是有关请求头的一些参数，例如：token }
axios.delete(url,params，config).then(res => {
    console.log("axios的get请求方法")
} )
1
2
3
4
5

//案例：管理员为姓名为王少，手机号为132********的人注册账号
const params = { name:"王少",phone:"132********" }
const config = { token : "difdhiohfhf7gfgsfs5468f8eqg" }//这里的token来自管理员登录成功后获得的token
axios.delete(url,parmas,config).then(res => {
    console.log("get")
} )
1
2
3
4
5
6

案例：
const config = { headers:{ token: 'difdhiohfhf7gfgsfs5468f8eqg' } }
this.$axios.delete('url/?username=Tom&phone=131****0001',config).then( res =>{
    console.log(res)  //这里打印可以看到是否请求状态及一些后端响应的信息
}).catch(error =>{
    console.log(error)  //接口请求1分钟还是没有响应，则会停止响应
}, 1000*60)
1
2
3
4
5
6
7

put

put 带参笔者知道两种格式，主要还是看后端需要那种是，一种是与post请求方式一样，一种与delete请求方式一样，只是带参的方式不同，下面笔者将这两种分别以两种案例写出来：

案例一
const config = { headers:{ token: 'difdhiohfhf7gfgsfs5468f8eqg' } }
const params = { name:"王少",phone:"132********" }
this.$axios.put('url/',params,config).then( res =>{
    console.log(res)  //这里打印可以看到是否请求状态及一些后端响应的信息
}).catch(error =>{
    console.log(error)  //接口请求1分钟还是没有响应，则会停止响应
}, 1000*60)
1
2
3
4
5
6
7
8

案例二：
const config = { headers:{ token: 'difdhiohfhf7gfgsfs5468f8eqg' } }
this.$axios.put('url/?username=Tom&phone=131****0001',config).then( res =>{
    console.log(res)  //这里打印可以看到是否请求状态及一些后端响应的信息
}).catch(error =>{
    console.log(error)  //接口请求1分钟还是没有响应，则会停止响应
}, 1000*60)
1
2
3
4
5
6
7

这篇文章应该不会多少人看到，也写的比较糟糕，自我尴尬三分钟