mockjs TS VUE全局使用

Mock.js 是一个用于模拟 HTTP 请求和数据的 JavaScript 库，它可以帮助你在单元测试或集成测试中替换真实的 API 调用。在 TypeScript 和 Vue.js 中全局使用 Mock.js，你可以以下几个步骤来设置：

1. **安装依赖**：
使用 npm 或 yarn 安装 `mockjs` 和可能的 TypeScript 配置库，如 `@types/mockjs`：

   npm install mockjs typescript @types/mockjs --save-dev
   # 或者
   yarn add mockjs typescript @types/mockjs --dev

2. **创建全局mock实例**：
在你的项目入口文件（通常为 `main.ts`）中，导入并配置 mockjs：

   import * as mock from 'mockjs';

   // 创建全局mock对象
   const mockData = mock.data;

3. **在Vue组件中使用mock数据**：
在你的 Vue 组件里，你可以使用 `mockData` 来生成随机数据或定义特定的响应：

   export default {
     data() {
       return {
         apiResponse: mockData('{"status":0,"msg":"成功","data":[]}', { status: 200 }) // 假设这是一个 API 调用
       };
     },
   };

这里 `mockData` 接收一个字符串模板（JSON格式）和可选的选项对象，用于定制返回的数据。

4. **在测试中使用mock数据**：
在测试文件中，你可以继续使用这个全局的 mock 数据，例如在 `vue-test-utils` 或 `jest` 测试框架下：

   import { shallowMount } from '@vue/test-utils';
   import YourComponent from '@/components/YourComponent.vue';

   test('YourComponent mock test', async () => {
     const wrapper = shallowMount(YourComponent);
     expect(wrapper.vm.apiResponse).toEqual({ /*期望的数据格式*/ });
   });