fix: 🔨 修复线上 Mock 报错的问题

docs: 📔 README 新增线上预览

README.md

@@ -25,7 +25,7 @@
     <img src="https://fastly.jsdelivr.net/gh/xiangshu233/blogAssets/2022/10/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20221022091917.png" width="400" />
     <img src="https://fastly.jsdelivr.net/gh/xiangshu233/blogAssets/2022/10/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20221022092004.png" width="400" />
     <img src="https://fastly.jsdelivr.net/gh/xiangshu233/blogAssets/2022/10/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20221022092015.png" width="400" />
-    <img src="https://fastly.jsdelivr.net/gh/xiangshu233/blogAssets/2022/10/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20221023152559.png" width="400" />
+    <img src="https://fastly.jsdelivr.net/gh/xiangshu233/blogAssets/2022/10/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20221022092022.png" width="400" />
   </span>
 </p>
 
@@ -35,10 +35,23 @@
     <img src="https://fastly.jsdelivr.net/gh/xiangshu233/blogAssets/2022/10/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20221022092052.png" width="400" />
     <img src="https://fastly.jsdelivr.net/gh/xiangshu233/blogAssets/2022/10/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20221022092140.png" width="400" />
     <img src="https://fastly.jsdelivr.net/gh/xiangshu233/blogAssets/2022/10/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20221022092224.png" width="400" />
-    <img src="https://fastly.jsdelivr.net/gh/xiangshu233/blogAssets/2022/10/%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20221022092358.png" width="400" />
+    <img src="https://fastly.jsdelivr.net/gh/xiangshu233/blogAssets/2022/10/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20221023152559.png" width="400" />
   </span>
 </p>
 
+## 线上预览
+- [vue3-vant4-mobile](https://vue3-vant4-mobile.xiangshu233.cn/)
+
+账号：admin，密码：123456
+
+账号：test，密码：123456
+
+
+或者扫描以下二维码进入手机演示
+<p align="center">
+  <img src="https://fastly.jsdelivr.net/gh/xiangshu233/blogAssets/2022/10/vue3-vant4-mobile-QR-code.png" width="200" />
+</p>
+
 ## 基础知识
 
 既然你搜了 `vue3`、`vant4` 此类关键词，则默认你会用这些配套技术栈。

mock/_createProductionServer.ts

@@ -1,6 +1,6 @@
 import { createProdMockServer } from 'vite-plugin-mock/es/createProdMockServer';
 
-const modules: Recordable = import.meta.glob('./**/*.ts');
+const modules = import.meta.glob('./**/*.ts', { eager: true }) as any;
 
 const mockModules: any[] = [];
 Object.keys(modules).forEach((key) => {

mock/user/user.ts

@@ -2,39 +2,37 @@ import { MockMethod } from 'vite-plugin-mock';
 import { getRequestToken, requestParams, resultError, resultSuccess } from '../_util';
 import { ResultEnum } from '@/enums/httpEnum';
 
-export function createFakeUserList() {
+const fakeUserList = [
-  return [
+  {
-    {
+    userId: 1,
-      userId: 1,
+    username: 'admin',
-      username: 'admin',
+    password: '123456',
-      password: '123456',
+    nickname: '一条咸鱼',
-      nickname: '一条咸鱼',
+    realname: 'administrator',
-      realname: 'administrator',
+    avatar: 'https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg',
-      avatar: 'https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg',
+    cover: '',
-      cover: '',
+    sign: '一年精通三年熟练五年入门',
-      sign: '一年精通三年熟练五年入门',
+    industry: 4,
-      industry: 4,
+    gender: 0,
-      gender: 0,
+    phone: '15758791450',
-      phone: '15758791450',
+    token: 'fakeToken1',
-      token: 'fakeToken1',
+  },
-    },
+  {
-    {
+    userId: 2,
-      userId: 2,
+    username: 'test',
-      username: 'test',
+    password: '123456',
-      password: '123456',
+    nickname: '萝卜头',
-      nickname: '萝卜头',
+    realname: 'test user',
-      realname: 'test user',
+    avatar:
-      avatar:
+      'https://link.jscdn.cn/1drv/aHR0cHM6Ly8xZHJ2Lm1zL3UvcyFBaFhWN0U3bHBTaWtsbkNaWjYxY0lLczdEUGlpP2U9Yldkd0Fp.jpg',
-        'https://link.jscdn.cn/1drv/aHR0cHM6Ly8xZHJ2Lm1zL3UvcyFBaFhWN0U3bHBTaWtsbkNaWjYxY0lLczdEUGlpP2U9Yldkd0Fp.jpg',
+    cover: '',
-      cover: '',
+    sign: '这个家伙很懒，什么都没有写~',
-      sign: '这个家伙很懒，什么都没有写~',
+    industry: 7,
-      industry: 7,
+    gender: 1,
-      gender: 1,
+    phone: '18822137893',
-      phone: '18822137893',
+    token: 'fakeToken2',
-      token: 'fakeToken2',
+  },
-    },
+];
-  ];
-}
 
 export default [
   {
@@ -43,7 +41,7 @@ export default [
     method: 'post',
     response: ({ body }) => {
       const { username, password } = body;
-      const checkUser = createFakeUserList().find(
+      const checkUser = fakeUserList.find(
         (item) => item.username === username && password === item.password
       );
       if (!checkUser) {
@@ -66,7 +64,7 @@ export default [
     response: (request: requestParams) => {
       const token = getRequestToken(request);
       if (!token) return resultError('无效令牌');
-      const checkUser = createFakeUserList().find((item) => item.token === token);
+      const checkUser = fakeUserList.find((item) => item.token === token);
       if (!checkUser) {
         return resultError('没有获取到对应的用户信息', {
           code: ResultEnum.TOKEN_EXPIRED,
@@ -82,7 +80,7 @@ export default [
     response: (request: requestParams) => {
       const token = getRequestToken(request);
       if (!token) return resultError('无效令牌');
-      const checkUser = createFakeUserList().find((item) => item.token === token);
+      const checkUser = fakeUserList.find((item) => item.token === token);
       if (!checkUser) {
         return resultError('无效令牌');
       }

src/utils/domUtils.ts

@@ -158,6 +158,7 @@ export function off(
 export function once(el: HTMLElement, event: string, fn: EventListener): void {
   const listener = function (this: any, ...args: unknown[]) {
     if (fn) {
+      // @ts-ignore
       fn.apply(this, args);
     }
     off(el, event, listener);