mockjs使用笔记

2018-12-13 本文已影响51人小二儿上酒

引言
简单使用
常用API
规则
参考文献

引言

MockJs很好的解决了以下这些问题：

前端可以随机的生成静态模拟数据
尽可能还原真实的数据模型
拥有了处理特殊的格式，例如IP,随机数，图片，地址的能力

简单使用

npm install mockjs --save 

// 定义模板
const Mock = require('mockjs');
var Random = Mock.Random;
Random.extend({
    uuid: function() {
        return Math.random().toString(36).substr(2);
    }
})
module.exports = {
    'status': 'ok',
    'results|25': [{
        'id|+1': 10,
        'posts': "@cparagraph(1)",
        'ctime': "@date('yyyy-MM-dd')",
        'title': '@ctitle(1,20)',
        'thumbnail': {
            'small': {
                url: "@image(321x210,@color())"
            },
            'large': {
                url: "@image(640x420,@color())"
            }
        }
    }]
}

常用API

Basic

Random.boolean( min?, max?, current? )返回一个随机的布尔值

Random.natural( min?, max? )返回一个随机的自然数（大于等于 0 的整数）

Random.integer( min?, max? )返回一个随机的整数

Random.float( min?, max?, dmin?, dmax? )返回一个随机的浮点数

Random.character( pool? )返回一个随机字符

Random.string( pool?, min?, max? )返回一个随机字符串

Random.range( start?, stop, step? )返回一个整型数组

Date

Random.date( format? )返回一个随机的日期字符串

Random.time( format? )返回一个随机的时间字符串

Random.datetime( format? )返回一个随机的日期和时间字符串

Random.now( unit?, format? )返回当前的日期和时间字符串

Image

Random.image( size?, background?, foreground?, format?, text? )生成一个随机的图片地址 Random.dataImage( size?, text? )生成一段随机的 Base64 图片编码

Color

Random.color()随机生成一个有吸引力的颜色，格式为 '#RRGGBB'

Random.hex()随机生成一个有吸引力的颜色，格式为 '#RRGGBB'。

Random.rgb()随机生成一个有吸引力的颜色，格式为 'rgb(r, g, b)'

Random.rgba()随机生成一个有吸引力的颜色，格式为 'rgba(r, g, b, a)'

Random.hsl()随机生成一个有吸引力的颜色，格式为 'hsl(h, s, l)'

Text

Random.paragraph( min?, max? )随机生成一段文本

Random.cparagraph( min?, max? )随机生成一段中文文本

Random.sentence( min?, max? )随机生成一个句子，第一个单词的首字母大写

Random.csentence( min?, max? )随机生成一段中文文本

Random.word( min?, max? )随机生成一个单词

Random.cword( pool?, min?, max? )随机生成一个汉字

Random.title( min?, max? )随机生成一句标题，其中每个单词的首字母大写

Random.ctitle( min?, max? )随机生成一句中文标题

Name

Random.first() 随机生成一个常见的英文名

Random.last()随机生成一个常见的英文姓

Random.name( middle? )随机生成一个常见的英文姓名

Random.cfirst()随机生成一个常见的中文名

Random.clast()随机生成一个常见的中文姓

Random.cname()随机生成一个常见的中文姓名

Web

Random.url( protocol?, host? )随机生成一个 URL

Random.protocol()随机生成一个 URL 协议

Random.domain()随机生成一个域名

Random.tld()随机生成一个顶级域名（Top Level Domain）

Random.email( domain? )随机生成一个邮件地址

Random.ip()随机生成一个 IP 地址 Address

Random.region()随机生成一个（中国）大区

Random.province()随机生成一个（中国）省（或直辖市、自治区、特别行政区）

Random.city( prefix? )随机生成一个（中国）市

Random.county( prefix? )随机生成一个（中国）县

Random.zip()随机生成一个邮政编码（六位数字）

Helper

Random.capitalize( word )把字符串的第一个字母转换为大写

Random.upper( str )把字符串转换为大写

Random.lower( str )把字符串转换为小写

Random.pick( arr )从数组中随机选取一个元素，并返回

Random.shuffle( arr )打乱数组中元素的顺序，并返回 Miscellaneous

Random.guid()随机生成一个 GUID

Random.id()随机生成一个 18 位身份证

Random.increment( step? )生成一个全局的自增整数

extend 扩展

Random.extend({
    uuid: function() {
        return Math.random().toString(36).substr(2);
    }
})
// 使用
"@uuid()"

规则

属性名和生成规则之间用竖线 |分隔。

生成规则是可选的。

生成规则有 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

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

参考文献

http://mockjs.com/