vue get類型接口調用方式

　　以下為本人總結的目前為止用過的get類型接口，包含帶參數和不含參數兩種情況，下面為代碼示例，其中導入的axios需要針對項目進行封裝，參考https://blog.csdn.net/xiehaiyanli/article/details/108114497：

1、有參數類型 params

（1）

　　api.js文件

import axios from '../libs/api.request';

export const getDataByTabName = (params, cb, err) => {
    axios.request({
        url: `h5/tab`,
        method: 'get',
        params
    }).then(cb)
    .catch(err)
};

　　vue文件。導入接口，調用接口，並通過getData獲取接口數據

import { getDataByTabName } from "./api";

let params = {
 name: '***'
};
getDataByTabName(params, res => {
    if(res.data) {
        this.getData = res.data.data;
    } else {
        Notify({ type: 'danger', message: '獲取數據錯誤' });
    }
}, err => {
    Notify({ type: 'danger', message: '服務器錯誤'+err });
})        

（2）

　　api.js文件

import axios from '@/libs/api.request'

export const getDataByTabName = (params) => {
  return axios.request({
    url: `h5/tab`,
    method: 'get',
    params,
  })
};

　　vue文件

import { getDataByTabName } from "./api";

let params = {
 name: '***'
};
getDataByTabName(params).then(res=>{
    this.getData = res.data.data;
})

（3）

　　api.js文件

import axios from '@/libs/api.request'
export const getDataByTabName = (params,cb) => {
    axios.request({
        url: `h5/tab`,
        method: 'get',
        params,
    }).then(cb);
}

　　vue文件

import { getDataByTabName } from "./api";
let params = {
 name: '***'
};
getDataByTabName(params,res=>{
    if(!res.data.data){
        this.$Message.error(res.data.message);
        return;
    }else{
        this.getData = res.data;
    }
})

2、無參數類型

（1）

　　api.js文件

import axios from '@/libs/api.request'

export const logout = () => {
  return axios.request({
    url: `${MODULE_URL}/loginOut`,
    method: 'get'
  })
}

　　vue文件

logout({}).then(res => {
    if (res.data.status) {
        let (data,message} = res.data;
        this.getData= data.data
    }else{
        this.$Message.error(message);
        return;
    }).catch(err => {
        this.$Message.error(message);
    })
}
//或者
logout().then(res => {
    this.getData = res.data
})

（2）

　　api.js文件

import axios from '@/libs/api.request'

export const getDataSourceName = (cb,err) => {
    axios.request({
        url:`${MODULE_URL}/getDataSourceName`,
        method:'get'
    }).then(cb)
    .catch(err)
}

　　vue文件

getDataSourceName(res => {
    let {data,status,message} = {...res.data};
    if(!status) {
        console.log(message);
        return;
    }
    this.getData = data.data;
},err => {
    this.$Message.error(err);
})