简单的直接用axios调用接口的方法(详细)
不封装的request的情况下使用axios调取后端数据
·
话不多说,上干货。
1、直接axios调用
首先在script中引入axios,直接写在export default外面,script标签里面
import axios from "axios";
2、在 methods中定义函数
gt() {
var url =
"http://10.30.118.38:6003/api/cicd-service/cicd/jenkinsproject/queryListByGroupType";
var params = {
//输入默认值的话是为了测试接口
pageNum: 1,
busiType: "12",
// xxx:this.xxxx 等号左侧输入是后端对应的要传过来的数据名称
//等号右侧假如输入this.xxxx是为了让后端的数据动态匹配上前端所使用的的名称
//例如:pageSize: this.pageSize 的冒号左侧是后端参数名称 ,右侧是前端的表格显示的名称
};
axios({
//请求使用的方法,可写get或者post等
method: "get",
//url写的是请求地址
url: url,
//params写的是数据请求条件 ,即后端给定的请求参数中,是否必须 是true的选项必须写在params内
params: params,
//以下都是固定写法
}).then((res) => {
//接口请求成功的一个标志,200是状态码,双等号前面不一定写res.data.code,
//这个写法是根据后端接口返回数据决定,code的值会告诉你。
if (res.data.code == 200) {
//可以打印看看传过来的值
console.log(res.data);
//等号左侧this.xxxx
//xxxx代表个人对 由页面中需要用到的数据组成的数组的集合 起的名字
//右侧res.data.xxxx xxxx是后端传过来的数组的名字
this.form = res.data.data;
this.form.methodPath =res.data.data.rpc
} else {
this.$message({
message: res.data.message,
type: "error",
});
}
});
},
3、将写好的gt函数,引入到mounted里面
mounted() {
this.gt();
},
搞定。其余的调用
更多推荐
已为社区贡献2条内容
所有评论(0)