当前位置:   article > 正文

vue 请求多个api_vue之封装多个组件调用同一接口的案例

组件请求同一接口互不干扰

背景:项目中有多个组件调用同一接口,为提高代码可维护性,需要封装公共方法

直接return 接口调用的结果

export function getall() {

let all = [];

let opt = {

method: 'get',

url: 'all/teacher',

success: res => {

all = res.data.value || [];

},

fail: err => {

tipinfo(err.data.desc, '提示', false, 'warning');

}

};

$http(opt);

return all;

}

console.log(getall()); // []

$http是在axios基础 进行封装的,是一个异步的方法,所以在组件中调用getall()方法,拿到的是一个空数组

使用promise进行封装

export function getall() {

return new promise((resolve, reject) => {

let opt = {

method: 'get',

url: 'all/teacher',

success: res => {

resolve(res.

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/繁依Fanyi0/article/detail/280271
推荐阅读
相关标签
  

闽ICP备14008679号