使用 mock.js 后 再也不用追着后端要接口啦

目录

安装

使用

mock的三种写法

数据模板定义

字符串 string

数字 number

 布尔值 Boolean

数组 array

---

生成随机数据，拦截 Ajax 请求

当前端开发程序员写好了接口文档，没有实现接口文档，就可以先自己造数据，模拟后端，开发前端的功能。等待后端接口做好，和后端联调，更改baseURL，实现切换接口服务器。

安装

npm i mockjs -D

使用

可以在 src 中新建一个 mock 目录，在里面新建一个 mock.js 

然后在 main.js 中导入

import '@/mock/mock.js'

mock的三种写法

Mock(url,method,data)
Mock(url,data)
Mock(url,method,function(options){
	return { //data数据 }
})

method：get 或 post

数据模板定义

字符串 string

'name|min-max': string

'name|count': string

例如：

Mock.mock({
	"star|1-5": "♡",
	"chart|2": "你好"
})

结果：

1-5（min-max）：随机重复1-5次

2（count）：重复2次

数字 number

'name|min-max': number

'name|min-max.dmin-dmax': number

    
Mock.mock({
    "age|1-200": 1,
    "price|200-500.2-5": 1
})

1-200（min-max）：随机生成一个1-200的数

200-500.2-5（min-max.dmin-dmax）：随机生成一个200-500之间的数，该数的小数位数为2-5位

 布尔值 Boolean

'name|min-max': boolean

Mock.mock({
	"love|1-2": true
})

1-2（min-max）：随机生成一个布尔值

数组 array

'name|count': array

'name|min-max': array

Mock.mock({
	"girl|2": ["小红", "小兰", "小黄"]
})

重复两次数组

---

更多可以打开官网查看：Mock.js