axios({
//请求方式 get post delete put
method:"",
//请求地址
url:"",
//query 参数
params:{
},
// body参数
data:{
},
//请求头 一般是用来指定请求传参格式
//请求中没有 data参数 所以headers content-type 默认为 content-type: "application/json;charset=UTF-8"
// headers: {
// // 'content-type': 'application/json;charset=UTF-8'（默认）
// "Content-Type": "application/x-www-form-urlencoded",
// 'content-type':"multipart/form-data"
// },
headers:{},
}).then(function(res){
console.log(res)
})
}
如何区分是不是get请求中的query请求？
第一种 params方式
// params 对象内写形式
getInstructorById1(id) {
axios({
method: "get",
url: "http://localhost:8080/instructor/getInstructorById",
params: {
id: id,
//如果 key value名字相同可简写 例如 id:id可以写为 id
},
}).then(function (res) {
console.log(res);
});
},
//params 对象外写形式
getInstructorById3(id) {
const params = {
id: id,
//如果 key value名字相同可简写 例如 id:id可以写为 id
};
axios({
method: "get",
url: "http://localhost:8080/instructor/getInstructorById",
params,
}).then(function (res) {
console.log(res);
});
},
第二种 拼接方式
//?a="a"&b="b" 拼接形式
getInstructorById2(id) {
axios({
method: "get",
url: `http://localhost:8080/instructor/getInstructorById?id=${id}`,
//与下面两种写法都可以
// url: "http://localhost:8080/instructor/getInstructorById?id=" + id,
}).then(function (res) {
console.log(res);
});
},
如何区分是Get中的path形式
//path
getById1(id) {
axios({
method: "get",
// url: "http://localhost:8080/instructor/getById/" + id,
//两种写法都可以
url: `http://localhost:8080/instructor/getById/${id}`,
}).then(function (res) {
console.log(res);
});
},
如何区分是post query请求
第一种 params
//post params
add1(id) {
axios({
method: "post",
url: "http://localhost:8080//instructor/add",
params: {
id: id,
name: "jhj",
},
}).then((res) => {
console.log(res);
});
},
第二种 formdata
add2(id) {
const params = {
id,
name: "jhj",
};
axios({
method: "post",
url: "http://localhost:8080//instructor/add",
data:params,
headers:{
'content-type':"multipart/form-data"
}
}).then((res) => {
console.log(res);
});
},
add3(id) {
const data=new FormData();
data.append("name","jhj")
data.append("id",id)
axios({
method: "post",
url: "http://localhost:8080//instructor/add",
data:data,
}).then((res) => {
console.log(res);
});
},
如何区分 是body post请求
addbody(id) {
axios({
method: "post",
url: `http://localhost:8080/instructor/addbody`,
data: {
id: id,
name: "jhj",
},
//请求中没有 data参数 所以headers content-type 默认为 content-type: "application/json;charset=UTF-8"
// headers: {
// // 'content-type': 'application/json;charset=UTF-8' 默认
// // "Content-Type": "application/x-www-form-urlencoded",
// // "content-type":"multipart/form-data"
// },
}).then(function (res) {
console.log(res);
});
},
putheader(id) {
axios({
method: "post",
url: `http://localhost:8080/instructor/putheader`,
//自定义header
headers: {
// 'content-type': 'application/json;charset=UTF-8'
// "Content-Type": "application/x-www-form-urlencoded",
// "content-type":"multipart/form-data"
myheader: id,
},
}).then(function (res) {
console.log(res);
});
},
//deleted params
del1(id) {
axios({
method: "delete",
url: "http://localhost:8080/instructor/delete",
params: {
id: id,
//如果 key value名字相同可简写 例如 id:id可以写为 id
},
}).then(function (res) {
console.log(res);
});
},
put(id) {
axios({
method: "put",
url: `http://localhost:8080/instructor/put`,
params: {
id: id,
name: "jhj",
},
}).then(function (res) {
console.log(res);
});
},
putbody(id) {
axios({
method: "put",
url: `http://localhost:8080/instructor/putbody`,
data: {
id: id,
name: "jhj",
},
}).then(function (res) {
console.log(res);
});
},
all(id) {
axios({
method: "post",
url: `http://localhost:8080/instructor/all/${id}`,
params: {
ids:id
},
data: {
id,
name: "jhj",
},
//自定义header
headers: {
// 'content-type': 'application/json;charset=UTF-8'
// "Content-Type": "application/x-www-form-urlencoded",
// "content-type":"multipart/form-data"
myheader: id,
},
}).then(function (res) {
console.log(res);
});
},
如有问题，欢迎指正！