小白快速了解mockjs的语法与使用

mockjs

程序分为

前段：访问后端接口展现数据

后端：负责处理业务逻辑访问数据，返回给前端

数据库：存储数据

mockjs情况

很多公司，后端还没有做好接口，写好接口文档（前段就不需要等待后端实现接口再写代码）

前端可以通过mockjs参考接口文档自己先模仿数据写业务代码，等待后端准备好，在用后端接口替换自己写的模拟数据，实现前后端同时开发。

mockjs的作用

1.：生成随机数据，拦截ajax

2.安装：npm i mockjs -D

3.使用：import Mock from ‘mockjs’ Mock.mock(url,data)

4.main.js导入：import ‘@/utils/mock.js’

mock用法

mock(url,data)
mock(url,method,data)
mock(url,method,function(option){
   return data
})
url:可以是正则，也可以是字符串
method:post,get,put,delete
option
	url 请求地址
	method请求方法
	body 请求第参数

随机

数字
	整数
		"num|1-100"
	小数点
		"price|25-50.2-3":1
	递增
字符串随机
	文字
		"score|1-5":"★"
	中文本标题
		"title":"@ctitle(8,14)"
	中文段落
		"des":"@paragraph"
布尔值
	"bol|1":true
数组
	"friend|1":[1,2,3]
"friend|2":[1,2,3]
复制两份
对象
	"des|2"：{}
随机从对象取两个属性
其他常用
	"tel":/1\d{10}/,
"email":/[a-z]{2,6}@(126|163|qq)\.(com|cn|net)/,
"canMerry":function(){
	if(this.age>22){
		return true;
	}else{
		return false;
	}
},
"day":"@date('yyyy-MM-dd')",
"time":"@time('HH:mm:ss')",
"add":"@county(true)",
"avatar":"@dataImage('200x100', ' ')"
		
}