将异步请求api及拦截器的操作封装到一个js中

This commit is contained in:
donqi 2022-05-10 11:56:18 +08:00
parent d54251e6e3
commit fa22cdf2b3
3 changed files with 38 additions and 27 deletions

28
common/js/request.js Normal file
View File

@ -0,0 +1,28 @@
export default {
// 异步接口拦截
addInterceptor() {
uni.addInterceptor('request', {
invoke(args) {
// request 触发前拼接 url
args.url = 'http://127.0.0.1:80' + args.url;
// console.log("停止触发");
// return false;
},
success(args) {
console.log('interceptor-success', args);
},
fail(err) {
console.log('interceptor-fail', err)
},
complete(res) {
console.log('interceptor-complete', res)
}
})
},
getProductCategories() {
return uni.request({
url: '/goods/category/list',
method: 'POST'
})
}
}

32
main.js
View File

@ -5,40 +5,26 @@ import CuCustom from 'colorui/components/cu-custom.vue';
import ConfirmModal from '@/components/modal/confirm-modal.vue'; import ConfirmModal from '@/components/modal/confirm-modal.vue';
import Data from './common/js/data.js'; import Data from './common/js/data.js';
import globalFun from './common/js/glogalFun.js'; import globalFun from './common/js/glogalFun.js';
import validate from './common/js/validate.js'; import validate from './common/js/validate.js';
import request from './common/js/request.js';
Vue.component('cu-custom', CuCustom) Vue.component('cu-custom', CuCustom)
Vue.component('confirm-modal', ConfirmModal); Vue.component('confirm-modal', ConfirmModal);
const data = type => { const data = type => {
//模拟异步请求数据 //模拟异步请求数据
return new Promise(resolve => { return new Promise(resolve => {
resolve(Data[type]); resolve(Data[type]);
}) })
} }
request.addInterceptor();
Vue.prototype.$api = { Vue.prototype.$api = {
data data
} }
Vue.prototype.$globalFun = globalFun; Vue.prototype.$globalFun = globalFun;
Vue.prototype.$validate = validate; Vue.prototype.$validate = validate;
Vue.prototype.$request = request;
// 异步接口拦截
uni.addInterceptor('request', {
invoke(args) {
// request 触发前拼接 url
args.url = 'http://127.0.0.1:80' + args.url;
console.log("停止触发");
return false;
},
success(args) {
console.log('interceptor-success', args);
},
fail(err) {
console.log('interceptor-fail', err)
},
complete(res) {
console.log('interceptor-complete', res)
}
})
Vue.config.productionTip = false Vue.config.productionTip = false

View File

@ -32,10 +32,7 @@
methods: { methods: {
async loadData() { async loadData() {
// this.categoryList = await this.$api.data('categoryList'); // this.categoryList = await this.$api.data('categoryList');
this.categoryList = await uni.request({ this.categoryList = await this.$request.getProductCategories();
url: '/goods/category/list',
method: 'POST'
})
}, },
bindEvent() { bindEvent() {
uni.$on(this.$globalFun.VERTICAL_NAV_GET_ITEM, this.chooseSubType); uni.$on(this.$globalFun.VERTICAL_NAV_GET_ITEM, this.chooseSubType);