完成了请求基地址和请提示的封装

.prettierrc

@@ -0,0 +1,8 @@
+{
+  "printWidth": 80,
+  "tabWidth": 2,
+  "useTabs": false,
+  "semi": false,
+  "singleQuote": true,
+  "vueIndentScriptAndStyle": true,
+}

main.js

@@ -1,11 +1,12 @@
-import App from './App';
+import App from './App'
-import uviewPlus from '@/uni_modules/uview-plus';
+import uviewPlus from '@/uni_modules/uview-plus'
+import '@/utils/utils'
 
-import { createSSRApp } from 'vue';
+import { createSSRApp } from 'vue'
 export function createApp() {
-  const app = createSSRApp(App);
+  const app = createSSRApp(App)
-  app.use(uviewPlus);
+  app.use(uviewPlus)
   return {
-    app
+    app,
-  };
+  }
 }

package-lock.json

@@ -6,13 +6,19 @@
     "": {
       "dependencies": {
         "clipboard": "^2.0.11",
-        "dayjs": "^1.11.10"
+        "dayjs": "^1.11.10",
+        "luch-request": "^3.1.1"
       },
       "devDependencies": {
         "sass": "^1.75.0",
         "sass-loader": "^14.2.1"
       }
     },
+    "node_modules/@dcloudio/types": {
+      "version": "2.6.12",
+      "resolved": "https://registry.npmjs.org/@dcloudio/types/-/types-2.6.12.tgz",
+      "integrity": "sha512-mrCMwcINy1IFjU9VUqLeWBkj404yWs5paLDttBcA+eqUjanuUQbBcTVPqlrGgkyzLXDcV2oDDZRSNxNpXi4kMQ=="
+    },
     "node_modules/anymatch": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
@@ -188,6 +194,14 @@
         "node": ">=0.12.0"
       }
     },
+    "node_modules/luch-request": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/luch-request/-/luch-request-3.1.1.tgz",
+      "integrity": "sha512-p7+mlcEtgRcd0OfXC4XZbyiwSr1XgCeqNT7LlVUjnk7InYl/8d5Rk7BUqAYNA2WRafI1wRIUQWRWZRpeUwWR0w==",
+      "dependencies": {
+        "@dcloudio/types": "^2.0.16"
+      }
+    },
     "node_modules/neo-async": {
       "version": "2.6.2",
       "resolved": "https://registry.npmjs.org/neo-async/-/neo-async-2.6.2.tgz",

package.json

@@ -5,6 +5,7 @@
   },
   "dependencies": {
     "clipboard": "^2.0.11",
-    "dayjs": "^1.11.10"
+    "dayjs": "^1.11.10",
+    "luch-request": "^3.1.1"
   }
 }

pages.json

@@ -90,6 +90,13 @@
         "navigationBarTitleText": "高手详情",
         "navigationStyle": "custom"
       }
+    },
+    {
+      "path": "pages/login/index",
+      "style": {
+        "navigationBarTitleText": "登录",
+        "navigationStyle": "custom"
+      }
     }
   ],
   "globalStyle": {

pages/login/index.vue

@@ -0,0 +1,21 @@
+<template>
+  <view>
+    <view
+      :style="{ backgroundPositionY: -44 + safeAreaInsets.top + 'px' }"
+      class="index-page"
+    >
+      <!-- 自定义导航 -->
+      <view
+        :style="{ paddingTop: safeAreaInsets.top + 'px' }"
+        class="page-navbar"
+      ></view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+  // 获取安全区域的边界
+  const { safeAreaInsets } = uni.getSystemInfoSync()
+</script>
+
+<style lang="scss"></style>

utils/http.js

@@ -0,0 +1,47 @@
+// 导入模块
+import Request from 'luch-request'
+
+// 实例化网络请求
+const http = new Request({
+  // 接口基地址
+  baseURL: '',
+  custom: {
+    loading: true,
+  },
+})
+
+//配置请求拦截器
+http.interceptors.request.use(
+  function (config) {
+    // 显示加载状态提示
+    if (config.custom.loading) {
+      uni.showLoading({ title: '正在加载...', mask: true })
+    }
+    // 定义头信息，并保证接口调用传递的头信息
+    // 能够覆盖在拦截器定义的头信息
+    config.header = {
+      Authorization: 'token',
+      ...config.header,
+    }
+
+    return config
+  },
+  function (error) {
+    return Promise.reject(error)
+  }
+)
+// 响应拦截器
+http.interceptors.response.use(
+  function ({ statusCode, data, config }) {
+    // 隐藏加载状态提示
+    uni.hideLoading()
+    // 解构出响应主体
+    return data
+  },
+  function (error) {
+    return Promise.reject(error)
+  }
+)
+
+// 导出配置好的模网络模块
+export { http }

utils/utils.js

@@ -0,0 +1,17 @@
+/**
+ * 项目中会用的一系列的工具方法
+ */
+uni.utils = {
+  /**
+   * 用户反馈（轻提示）
+   * @param {string} title 提示文字内容
+   * @param {string} icon 提示图标类型
+   */
+  toast(title = '数据加载失败！', icon = 'none') {
+    uni.showToast({
+      title,
+      icon,
+      mask: true,
+    })
+  },
+}