mockjs 使用

-> 安装

npm install mockjs

-> 模拟数据

Mock.mock(template)
Mock 需要的目标数据，该部分需使用指定的规则, eg:

// 使用 Mock
var Mock = require('mockjs')
var data = Mock.mock({
    // 属性 list 的值是一个数组，其中含有 3 个元素
    'list|3': [{
        // 属性 id 是一个自增数，起始值为 1，每次增 1
        'id|+1': 1
    }]
})
// 输出结果
console.log(JSON.stringify(data, null, 4))
/**
{
    "list": [
        {
            "id": 1
        },
        {
            "id": 2
        },
        {
            "id": 3
        }
    ]
}
*/

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

详细规则见 Syntax-Specification (opens new window)

-> 拦截请求

Mock.mock(rurl, [rtype,] template|function( options ))
实现拦截 AJAX请求，并返回指定数据结构的功能。
该部分在模拟数据api的基础上增加了请求url（字符串或正则表达式），请求方法类型等参数，并实现了自动拦截请求的功能，十分强大。 eg：

Mock.mock('/domian/list.json', {
    'list|1-10': [{
        'id|+1': 1,
        'email': '@EMAIL'
    }]
})

Mock.mock(/\.json/, 'get', function(options) {
    return options.type
    //options含有request对象的 url、type 和 body 三个属性
})

1
2
3
4
5
6
7
8
9
10
11

详细规则参考 mock 拦截 (opens new window)

值得注意的是，这是一个纯前端的操作，原理是它重写了浏览器的 XMLHttpRequest对象，拦截符合注册规则的请求直接返回。
但也正因如此，XMLHttpRequest对象的底层变化可能会引入一些意料之外的bug。

-> 工具方法

提供对Mock对象mock方法的重载，实现了两个最重要的api，即模拟数据及拦截请求。
除此之外，还提供了一些其它实用方法：

Mock.setup 设置模拟响应的时间, 单位为ms
```
Mock.setup({
    timeout: '200-600'
})
```
1
2
3

Mock.Random 随机类型数据生成，内置了非常多的种类，开箱即用，也可以自定义扩展。详情见 Mock.Random

var Random = Mock.Random
Random.email()
// => "[email protected]"
Mock.mock('@email')
// => "[email protected]"
Mock.mock( { email: '@email' } )
// => { email: "[email protected]" }

1
2
3
4
5
6
7

Mock.valid( template, data ) 测试给定数据是否符合模板的规则, 符合则返回空数组，否则返回详细比较结果
Mock.toJSONSchema( template ) 返回给定模板的 JSONSchema，特定场景下非常实用

-> 参考

编辑此页

更新于: 2018-12-12