1. this.$api.LeadershipScreen.getImportantRiskList(params)

在api文件下层级关系如下图：
在这里插入图片描述
在index.js下

// 导入所有接口
import api from './api'
const install = Vue => {if (install.installed)return;install.installed = true;Object.defineProperties(Vue.prototype, {// 注意，此处挂载在 Vue 原型的 $api 对象上$api: {get() {return api}}})
}
export default install

在api.js

/*接口统一模块*/
import * as LeadershipScreen from './componet/LeadershipScreen'
export default {LeadershipScreen
}
/*使用模板
*  this.$api.auditApi.auditDataAll().then(response=>{}).catch(error=>{})*/

在componet/LeadershipScreen.js

import { request } from "../../utils/request6";
export const getImportantRiskList = (data) => {
//allUrl2 可以写一个公共的地方将allUrl2 引进来return request({method: 'get',url: allUrl2 + '/important/getImportantRiskList',data});
};

在页面中使用

 this.$api.LeadershipScreen.getImportantRiskList(params).then((res) => {console.log("res.data111111111111", res.data);this.getList = res.data;}).catch((error) => {});

//methodName:null;
let params={}
this.methodName = this.$api.LeadershipScreen.getImportantRiskList;
this.methodName(params).then((res) => {console.log("res", res);}).catch((error) => {});

2.引用，然后直接调用

定义在api.js文件中

import request from '@/utils/request'
export const selectTaskInfo = (id, params) => request({ url: '/project-mgt/project/v1.0/selectTaskInfo?taskId=' + id, method: 'get', params })export function setFormulaConfig(params) { return request({ url: '/project-mgt/project/v1.0/formulaConfig', method: 'get', params }) }//此处的params，会自动将参数拼在后面，data则不会export const projectSelectionAdd = (data) => request({ url: '/project-mgt/project/v1.0/add', method: 'post', data })

使用

import {selectTaskInfo, setFormulaConfig, projectSelectionAdd ,
} from "@/code/projectSelection/api/projectSelectionApi";

//一种：直接传递id，
selectTaskInfo(id).then((res) => {console.log("resaaaaaaaa", res.data);}).catch((err) => {console.log(err);});//一种：直接传递一个对象
let params = {id: this.Form.id,
};
setFormulaConfig(params).then((res) => {if (res.code == "200") {console.log("resaaaaaaaa", res.data);this.$message.success("成功");}}).catch((err) => {});//一种：三元表达式根据不同的情况进行调用不同的接口
let interfaceName =this.$route.query.state == "add"? projectSelectionAdd: projectUpdate;
interfaceName(params).then((res) => {if (res.code == "200") {this.$message.success(this.$route.query.state == "add" ? "新增" : "修改");} else {this.$message.error(res.msg);}}).catch((err) => {});

3.axios（需要先安装axios）

import axios from "axios";

get

// 为给定 ID 的 user 创建请求
const config = {headers:{"userId":1212}
};
axios.get('/user?ID=12345',config).then(function (response) {console.log(response);}).catch(function (error) {console.log(error);});// 可选地，上面的请求可以这样做
axios.get('/user', {params: {ID: 12345}}).then(function (response) {console.log(response);}).catch(function (error) {console.log(error);});

post

axios.post('/user', {firstName: 'Fred',lastName: 'Flintstone'}).then(function (response) {console.log(response);}).catch(function (error) {console.log(error);});

https://www.kancloud.cn/yunye/axios/234845
下面的比较好，推荐使用

getQuestionSurvey() {let testUrl = "";if (process.env.NODE_ENV === "development") {testUrl = "http://192.168.121.2:8080";//模拟，并非真实地址} else {testUrl = process.env.VUE_APP_BASE_API;}testUrl = testUrl + "/getFillReportById/" + this.id;axios({method: "get",url: testUrl,headers: {"Content-Type": "application/x-www-form-urlencoded",userId: this.userId,},}).then((res) => {//if (this.state != "editAjustMent") {// this.tableData1.forEach((item, index) => {//   for (const key in item.detailVoMap) {//     if (key.length > 17) {//      item.detailVoMap[key].fixedFlag = 0;//     }//}//});//}}).catch((err) => {console.log("err.response.data",err.response,err.response.data,err.response.data.data,err.response.data.msg);this.$message.error(err.response.data.data? err.response.data.data: err.response.data.msg);});},

4.配置request

import axios from 'axios'
import { MessageBox, Message } from 'element-ui'
import store from '@/store'
import { getToken } from '@/utils/auth'
import qs from 'qs'
import cookieStore from '@/utils/common';
// Vue.prototype.$cookieStore = cookieStore;
// create an axios instance
const service = axios.create({baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url// withCredentials: true, // send cookies when cross-domain requeststimeout: 500000000 // request timeout
})
// request interceptor
service.interceptors.request.use(config => {// do something before request is sentif (config.requestType === 'form') {config.headers = { 'content-type': 'application/x-www-form-urlencoded;charset=UTF-8' }console.log('form')config.data = qs.stringify(config.data, { indices: false })} else if (config.requestType === 'json' || !config.requestType) {console.log('json')config.headers = { 'content-type': 'application/json;charset=UTF-8' }}if (store.getters.token) {config.headers['Authorization'] = getToken()}//加请求头config.headers['userId'] = "1036465471609819137"; //1return config},error => {// do something with request errorconsole.log(error) // for debugreturn Promise.reject(error)}
)// response interceptor
service.interceptors.response.use(response => {const res = response.dataif (res.code == 200) {return Promise.resolve(res)} else if (res.code == 0) {return Promise.resolve(res)} else if (res.code == 401) {Message.error(res.msg)store.dispatch('user/resetToken').then(() => {location.reload()})} else if (res.code == 20000) {return Promise.resolve(res)} else {Message({message: res.msg,type: 'error'})return Promise.reject(res)}},error => {console.log('err' + error) // for debugconsole.log(error.response)Message({message: error.response.data.data ? error.response.data.data : error.response.data.msg,type: 'error',duration: 5 * 1000})return Promise.reject(error.response)//此操作，可以直接拿到报错的信息error.response}
)export default service