Vue中使用Mock.js来模拟后端数据

第一步：安装mock.js

npm install mockjs --save-dev

第二步：main.js中引入mock

// 引入mock
import "@/mock";

第三步：mock/index.js配置mock

// 引入mockjs
import Mock from "mockjs";

// Mock.setup({}) 配置mock
Mock.setup({
  // timeout来设置数据的延迟响应
  timeout: "20-2000",
});

// Mock.mock(/请求路径/(正则),"请求方式",(req)=>{}) 来模拟后台数据 通过return来返回数据
Mock.mock(/\/api\/test/, "get", (req: any) => {
  console.log(req);
  return {
    code: 200,
    data: {
      msg: "mock模拟数据成功",
    },
  };
});

// 暴露Mock
export default Mock;

第四步：vue3中要在shims-vue.d.ts配置mock为一个模块，否则会报错

// 宣布mockjs为一个模块 
declare module "mockjs"