mock.js的基本使用

soosgo

已于 2022-08-25 15:54:13 修改

阅读量1.2k

点赞数

分类专栏： MockJS 文章标签：前端 json

于 2022-08-22 16:55:36 首次发布

本文链接：https://blog.csdn.net/doulvme/article/details/126468186

版权

本文介绍了Mock.js的基本使用，包括数据模板的语法规范、数据占位符的使用，以及Mock.Random提供的各种随机数据生成方法。通过实例展示了如何在项目中安装和使用Mock.js来创建模拟接口，以及如何返回数组类型的模拟数据。

摘要由CSDN通过智能技术生成

一、语法规范

数据模板中的每个属性由 3 部分构成：属性名、生成规则、属性值：

// 属性名   name
// 生成规则 rule
// 属性值   value
'name|rule': value

注意：

属性名和生成规则之间用竖线 | 分隔。
生成规则是可选的。
生成规则有 7 种格式：

'name|min-max': value
'name|count': value
'name|min-max.dmin-dmax': value
'name|min-max.dcount': value
'name|count.dmin-dmax': value
'name|count.dcount': value
'name|+step': value

生成规则的含义需要依赖属性值的类型才能确定。
属性值中可以含有 @占位符。
属性值还指定了最终值的初始值和类型。

生成的规则和示例：

1.属性值是字符串String

'name|min-max': string,//通过重复 string 生成一个字符串，重复次数大于等于 min，小于等于 max。
'name|count': string,//通过重复 string 生成一个字符串，重复次数等于 count。
'name|1-3':'abc',//生成字符串abc重复1-3次

2.属性值是数字Number

'name|+1': number,//属性值自动加 1，初始值为 number。
'name|min-max': number,//生成一个大于等于 min、小于等于 max 的整数，属性值 number 只是用来确定类型。
'name|min-max.dmin-dmax': number,//生成一个浮点数，整数部分大于等于 min、小于等于 max，小数部分保留 dmin 到 dmax 位。

Mock.mock({
    'number1|1-100.1-10': 1,
    'number2|123.1-10': 1,
    'number3|123.3': 1,
    'number4|123.10': 1.123
})
// =>
{
    "number1": 12.92,
    "number2": 123.51,
    "number3": 123.777,