接口

common/api/shop.js

@@ -0,0 +1,10 @@
+export default {
+    init(vm){
+        return {
+            postlogn({id,name}){
+                return vm.$u.get('url',{id,name});
+            }
+        }
+    }
+    
+}

common/api/user.js

@@ -0,0 +1,10 @@
+export default {
+    init(vm){
+        return {
+            getlogn({id,name}){
+                return vm.$u.get('popArticles');
+            }
+        }
+    }
+    
+}

common/http.api.js

@@ -0,0 +1,16 @@
+
+// 此处第二个参数vm，就是我们在页面使用的this，你可以通过vm获取vuex等操作，更多内容详见uView对拦截器的介绍部分：
+// https://uviewui.com/js/http.html#%E4%BD%95%E8%B0%93%E8%AF%B7%E6%B1%82%E6%8B%A6%E6%88%AA%EF%BC%9F
+import shop from "./api/shop"
+import user from "./api/user"
+
+const install = (Vue, vm) => {
+    let userapi = user.init(vm) 
+    let shopapi = shop.init(vm) 
+	// 将各个定义的接口名称，统一放进对象挂载到vm.$u.api(因为vm就是this，也即this.$u.api)下
+	vm.$u.api = {...userapi,...shopapi};
+}
+
+export default {
+	install
+}

common/http.interceptor.js

@@ -0,0 +1,62 @@
+const install = (Vue, vm) => {
+	// 此为自定义配置参数，具体参数见上方说明
+	Vue.prototype.$u.http.setConfig({
+		baseUrl: 'https://luyuan.tk/api',
+		loadingText: '努力加载中~',
+		loadingTime: 800
+		// ......
+	});
+	
+	// 请求拦截，配置Token等参数
+	Vue.prototype.$u.http.interceptor.request = (config) => {
+		// 引用token
+		// 方式一，存放在vuex的token，假设使用了uView封装的vuex方式
+		// 见：https://uviewui.com/components/globalVariable.html
+		// config.header.token = vm.token;
+		
+		// 方式二，如果没有使用uView封装的vuex方法，那么需要使用$store.state获取
+		// config.header.token = vm.$store.state.token;
+		
+		// 方式三，如果token放在了globalData，通过getApp().globalData获取
+		// config.header.token = getApp().globalData.username;
+		
+		// 方式四，如果token放在了Storage本地存储中，拦截是每次请求都执行的
+		// 所以哪怕您重新登录修改了Storage，下一次的请求将会是最新值
+		// const token = uni.getStorageSync('token');
+		// config.header.token = token;
+		// config.header.Token = 'xxxxxx';
+		
+		// 可以对某个url进行特别处理，此url参数为this.$u.get(url)中的url值 
+		// if(config.url == '/user/login') config.header.noToken = true;
+		// 最后需要将config进行return
+		return config;
+		// 如果return一个false值，则会取消本次请求
+		// if(config.url == '/user/rest') return false; // 取消某次请求
+	}
+	
+	// // 响应拦截，判断状态码是否通过
+	// Vue.prototype.$u.http.interceptor.response = (res) => {
+	// 	if(res.code == 200) {
+	// 		// res为服务端返回值，可能有code，result等字段
+	// 		// 这里对res.result进行返回，将会在this.$u.post(url).then(res => {})的then回调中的res的到
+	// 		// 如果配置了originalData为true，请留意这里的返回值
+	// 		return res.result;
+	// 	} else if(res.code == 201) {
+	// 		// 假设201为token失效，这里跳转登录
+	// 		vm.$u.toast('验证失败，请重新登录');
+	// 		setTimeout(() => {
+	// 			// 此为uView的方法，详见路由相关文档
+	// 			vm.$u.route('/pages/user/login')
+	// 		}, 1500)
+	// 		return false;
+	// 	} else {
+	// 		// 如果返回false，则会调用Promise的reject回调，
+	// 		// 并将进入this.$u.post(url).then().catch(res=>{})的catch回调中，res为服务端的返回值
+	// 		return false;
+	// 	}
+	// }
+}
+
+export default {
+	install
+}

main.js

@@ -8,4 +8,11 @@ App.mpType = 'app'
 const app = new Vue({
     ...App
 })
+// http拦截器，将此部分放在new Vue()和app.$mount()之间，才能App.vue中正常使用
+import httpInterceptor from '@/common/http.interceptor.js'
+Vue.use(httpInterceptor, app)
+
+// http接口API集中管理引入部分
+import httpApi from '@/common/http.api.js'
+Vue.use(httpApi, app)
 app.$mount()

pages/index/index.vue

@@ -196,6 +196,14 @@ export default {
                 this.num = a
             }
         }
+    },
+    onLoad(){
+        this.$u.api.getlogn({
+            id:1,
+            name:2
+        }).then((res)=>{
+            console.log(res)
+        })
     }
 }
 </script>

static/js/http.js

@@ -0,0 +1 @@
+let baseurl = "";