一、mockjs介绍
mockjs可以生成随机数据,模拟原生 XMLHttpRequest 的行为拦截 Ajax 请求,实现前后端分离。
二、安装
1.如果项目已经用webpack打包了,直接使用nodejs(CommonJS)的方式安装:
npm install mockjs
2.如果是想在js文件中测试,可以使用nodejs提供依赖包的方式:
npm install mockjs --save -dev
三、使用方式
Mock.mock有四个参数:
1.rurl(可选,AJAX请求要拦截的url地址,可以是字符串或者正则)
2.rtype(可选,要拦截的请求类型,get,post等)
3.templete(要mock的数据模板,和function可替换,可以是对象或字符串)
4.function(当拦截了AJAX请求之后,执行function,并把执行结果作为响应数据返回)
Mock.mock(
rurl(option) rtype(option) (templete){'name|rule':value} function(option)
)
四、模板(templete)规则
数据模板中每个属性由三部分构成:
- 名字(name)可以自己设定要生成的名字
- 属性值(value) 覆盖了JS的数据类型以及Data,Color,Adress等类型
-
生成规则(rule) 有7种格式(以Number类型为例)
'name|min-max': value
如:number|1-10,随机生成长度为1-10的对应数据,value此时仅用来确定'name|count': value
如:3 生成3,生成确定的数字'name|min-max.dmin-dmax': value
如:1-100.1-10 生成23.23214,前面的是整数,后面是小数的位数'name|min-max.dcount': value
如:1-10.3 生成22.933,前面是整数,后面是3位随机小数'name|count.dmin-dmax': value
如:3.1-10'name|count.dcount': value
如:4.2'name|+step': value
如:"number|+1": 202 生成 203或402或1230 属性值自动加1,加1的个数随机