018-Vue项目生成模拟数据

开发过程中，与后端未搭建好联调环境时，没有数据。
此时前端无法进行测试，开发起来就比较头疼了。
使用mockjs，拦截Ajax请求，并且随机生成和后端协商好的数据格式，
这样即使服务端环境无法使用，前端也可以愉快的coding了。
接下来聊聊它的使用方法吧：

一、node环境

1、在项目中初始化mock.js

npm i mockjs

2、创建mock数据文件

// 引入Mock对象
import Mock from 'mock';
// 模拟数据,mock()
/*
此处的第一个参数：为一个正则，匹配的是接口字段；
第二个参数:拦截到请求该接口时，返回的数据；

*/
Mock.mock(/getProductList/,{
	// 此处使用了mock的数据模板；
	// list为字段名称，'|5'则是该字段下有5个子集。
	"list|5": [
		{
			// @url，mockjs回根据url规则随机生成字段
			'url': '@url',
			// @ctitle，c-chinese，随机生成5-20个汉字
			'title': '@ctitle(5,20)'
		}
	]
})

3、在全局中引入(man.js)

import mock from './mock/mock'

4、数据接口请求

axios.post('getProductList',{date: new Date()}).then(res=>{
	console.log(res);
}).catch(err => {
	console.log(err);
})

二、更多精彩

http://mockjs.com/