本文共 1880 字，大约阅读时间需要 6 分钟。

Mock.js 文档

Mock.mock() 方法

Mock.js 提供了多种方式来模拟数据请求，以下是主要的方法说明：

1. Mock.mock(template)

说明：

• 模板为字符串时，例如 '@EMAIL'，将替换为实际的邮件地址。
• 模板为对象时，例如 { 'data|1-10': [{}], 'meta': { 'page': 1 } }，将生成对应的模拟数据。

示例：

Mock.mock('http://example.com/api/users', {  data: ["Alice", "Bob", "Charlie"],  meta: {    page: 1,    limit: 10  }});

2. Mock.mock(rurl, template)

说明：

示例：

Mock.mock(/\/domain\/list\.json/, {  data: [],  meta: {    current_page: 1,    total_page: 10  }});

3. Mock.mock(rurl, function)

说明：

示例：

Mock.mock('http://example.com/api', (options) => {  return {    id: options.param.id,    name: options.body.name  };});

4. Mock.mock(rurl, rtype, template)

说明：

示例：

Mock.mock('http://example.com/api/users', 'GET', {  data: [],  meta: {    total_count: 100,    current_page: 1  }});

5. Mock.mock(rurl, rtype, function)

说明：

示例：

Mock.mock('http://example.com/api', 'POST', (options) => {  return {    id: options.body.id,    status: 'success'  };});

参数说明

rurl

• 类型： 可选
• 说明：
  表示需要拦截的 URL，可以是 URL 字符串或正则表达式。例如：
  • 字符串形式：'/domain/list.json'
  • 正则表达式形式：/\/domain\/list\.json/

rtype

• 类型： 可选
• 说明：
  表示需要拦截的 AJAX 请求类型，支持 GET、POST、PUT、DELETE 等。

template

• 类型： 可选
• 说明：
  表示数据模板，可以是字符串或对象。模板中的占位符（如 @EMAIL）将被替换为实际值。

function

• 类型： 可选
• 说明：
  表示用于生成响应数据的函数。当拦截到匹配 rurl 的请求时，函数将被执行，返回结果作为模拟响应。

示例

拦截特定 URL 的 GET 请求并返回模拟数据

Mock.mock('/api/user', 'GET', {  data: [    { id: 1, name: 'Alice' },    { id: 2, name: 'Bob' }  ],  meta: {    current_page: 1,    total_page: 10  }});

使用函数生成模拟响应

Mock.mock('/api/auth', 'POST', (options) => {  return {    token: 'abcd1234',    expiration: '2024-01-01'  };});

Mock.js 通过模拟 AJAX 请求，帮助开发人员在不实际调用后端 API 的情况下测试前端代码。它不依赖任何第三方库，基于原生 XMLHttpRequest 实现，支持多种请求类型和灵活的模板配置。