mockjs的常用语法与用例

mockjs的常用语法

作用：模拟后端接口返回的数据
注意（mockjs重点，避免踩坑,我已踩过）：mockjs的模拟接口地址
必须是正则表达式的形式如：Mock.mock(/localhost:8080\/login/, ‘post’…）
存在原因：
1.前后端分离
2.可生成你需要的随机数据
3.用法简单
4.在后端接口完成之后，只需要改变url请求地址即可。
改动的地方在文章最后：

npm install mockjs --save-dev // 安装

Mock.setup({ //表示 2000 毫秒 后才会返回响应内容；
    timeout: 2000
})
// 定义数据类型
var data = Mock.mock({
  // 自动生成20条数据
  "data|20": [{
    // 从ID为1开始，每条数据ID自动加1
    "ID|+1": 1,
    // 随机生成一个中文名-->俊怡
    'name': "@cname",
    // 随机生成数组中的1项-->房产消费
    'type|1': ["汽车消费","房产消费","抵押贷款"],
    // 随机生成5-20个中文-->次几委数没百电报个者料完改从
    'text|5-20': '@cword',
    // 随机生成一个范围0-10的数字-->6
    'account|0-10': 1,
    // 随机生成一个日期时间-->"1975-10-27 00:44:40"
    "date":"@date('yyyy-MM-dd HH:mm:ss')"
    // 随机生成一个日期-->"1975-10-27"
    "date":"@date"
    // 随机生成一个大小100×100，颜色随机,格式为png的图片地址
    "imgUrl": "@Image('100x100','@color','png')",
    // 随机生成一个邮箱：
    "email": "@email",
    // 随机生成一个颜色-->#79f2e3
    "color": "@color",
    // 随机生成一个布尔值-->true
    "is": "@boolean",
    // 随机生成一个英文名-->Helen Brown
    "name": "@name",
    // 随机生成十个中文组成的标题
    "title": "@ctitle(10)",
    // 随机生成一个中国大区
    "cregion":"@region",
    // 随机生成一个省
    "cprovince":"@province",
    // 随机生成一个市
    "ccity":"@city",
    // 随机生成一个县
    "country":"@county",
    // 随机生成一个省 + 市
    "ss":"@city(true)",
    // 随机生成一个省市县-->"陕西省 商洛市 山阳县"
    "countrysx":"@county(true)",
  	//随机生成邮政编码
    "code":"@zip"
  }]
})
  // 输出结果
  console.log(data);

根据后端完成接口文档，需要改动的地方：
模拟接口是这么写的：

首先需要改封装后的baseURL地址：

最后改请求接口的地方：