前言

现在越来越多项目都采用前后端分离模式开发，这样前后端就可以同时开发，而且互不影响。但是目前项目跟进的很紧，没什么时间写后台，但是前端没接口测试可能会隐藏很多bug，到后面再来排查就麻烦了。所以在后端接口没有开发之前，我打算先用mockjs模拟下后端服务器，生成模拟的假数据，以便于顺利进行前端的开发工作。

什么是Mockjs

Mockjs 是一款模拟数据生成工具，模拟 Ajax 请求，通过随机生成数据来模拟各种业务场景并返回模拟数据，帮助前端在后台未提供接口时实现独立开发。Mockjs支持的随机数据类型很丰富，包括文本、数字、布尔值、日期、邮箱、链接、图片、颜色等等，足够我们开发使用了。

安装Mockjs

mockjs只用于开发环境实现模拟数据，而生产环境有真正的后台服务器因此需要mockjs，因此在安装mockjs的时候记得带上参数 --save-dev，进入到项目目录，执行指令：npm i mockjs --save-dev

mockjs使用

最简单的方式就是直接新建一个mock.js文件，然后引入mockjs插件，设置一个延迟时间虚拟服务器响应效果，然后通过Mock.mock拦截请求并随机生成数据返回。

import Mock from 'mockjs' //引入mockjsMock.setup({ timeout: 500 //延迟效果})//拦截请求并返回数据Mock.mock('login/', 'post', { 'code': 200, // 状态码 'userid': '@id()', // 随机生成用户id 'username': '@cname()', // 随机生成中文名字 'date': '@date()', // 随机生成日期 'avatar': "@image('200x200','red','#fff','avatar')