--get请求:axios中常见的get/delete请求,也称作query请求:
携带参数在浏览器控制台的显示
//一般发送请求是这么写(不推荐):
axios.get('/user?id=12345&name=user')
//但是为了方便全局统一调用封装的axios,采用
axios.get('/user', { //params参数必写 , 如果没有参数传{}也可以
params: {
id: 12345,
name: user
}
})
vue中axios 的delete和post,put在传值上有点区别;
post和put有三个参数,url,data和config,
所以在使用这两个时,可以写成axios.post(api,{id:1}),axios.put(api,{id:1}),
但是delete只有两个参数:url和config,data在config中,
所以需要写成 axios.delete(api,{data:{id:1}})
如果是服务端将参数当作对象来封装接收则 参数格式为:{data: param}
axios.delete("/api", {data: param})
如果服务端将参数当做url 参数 接收,则格式为:{params: param},这样发送的url将变为http:www.XXX.com?a=..&b=..
axios.delete("/api", {params: param})
--post请求常见的数据格式(content-type)
1.Content-Type: application/json : 请求体中的数据会以json字符串的形式发送到后端
2.Content-Type: application/x-www-form-urlencoded:请求体中的数据会以普通表单形式(键值对)发送到后端
3.Content-Type: multipart/form-data:既可以上传键值对,也可以上传文件。与application/x-www-form-urlencoded 的区别是她支持文件的传输,并且它的传输数据放在request-payload里,并且以bounday进行分隔。
1.Content-Type: application/json
如果没有特别声明,application/json是Axios默认的Content-Type,它声明了请求体中的数据将会以json字符串的形式发送到后端。在请求的时候,需要将需要传给后台的数据JSON序列化即可。
const params = {
name:'ttt',
age:18
};
this.$axios.post("/XXXX/XXXX", params).then(data => {
//To Do
});
2.application/x-www-form-urlencoded
#引入 qs ,这个库是 axios 里面包含的,不需要再下载了。
import axios from 'axios';
import qs from 'qs'
let data={name:'张三',age:18};
axios.post('url',qs.stringify(data))
.then(res=>{
console.log('返回数据:',res)
})
3.multipart/form-data
import axios from 'axios';
let data=new FormData();
data.append('name','张三');
data.append('age',18);
axios.post('url',data)
.then(res=>{
console.log('返回数据:',res)
})