常用的请求/fetch/axios

最新推荐文章于 2023-10-15 20:10:11 发布

负者歌于途，

最新推荐文章于 2023-10-15 20:10:11 发布

阅读量121

点赞数

分类专栏： Vue 文章标签：路由

本文链接：https://blog.csdn.net/qq_36893984/article/details/102495624

版权

Vue 专栏收录该内容

28 篇文章 0 订阅

订阅专栏

fetch

参数：

method：请求方式 get post put delete(get ,delete只需要设置method就行了)

fetch("http://127.0.0.1:3000/"，{
    method:"post",
    body:"unmae=list&pwd=123",
    headers:{
        'Content-Type':'application/x-www-form-urlencoded'
    }
}).then(function(data){
    return data.text()
    //text()属于fetch一部分，用于返回Promise对象，将返回处理成字符串类型
    //json()将返回Json格式的对象
}).then(function(data){
    //这里的data才是真实的数据
})

post另一种方法:主要是因为body-parser提供了解析json格式的能力
method:"post",
body:JSON.stringify({

}),
header:{
    'Content-Type':'application/json'
}

put跟post第二种一致，不过put还可以通过参数项传递数据

AXIOS

自动转换JSON格式/可以拦截请求和响应/底层是ajax/支持promise

GET/DELETE:
axios.get("接口").then(function(reg){
    //data是固定的，用于获取后台的实际数据
    console.log(reg.data)
})  
1.直接在接口后面添加参数  "?id=1",
2.在接口后面添加 "/3"，通过参数项的方式  后台通过 req.params获取参数
3.params ，在接口后面添加对象  
('接口',{
    params:{
        id:789
    }
})
后台通过 query  获得参数

POST:
1.传递的是json格式的字符串
axios.post('接口',{
    id:1,
    uname:'zs'
}).then(function(ret){
    console.log(ret.data)
})
后台得到数据使用 body

2传递的是字符串格式的参数
let params = new URLSearchParams()
params.appende('uname','zs');
axios.post('接口',params).then(function(ret){
    console.log(ret.data)
})
PUT传递参数的方式与POST一致：需要通过参数项的格式传递id