首页 > 其他分享 >mockjs

mockjs

时间:2022-10-17 17:01:58浏览次数:80  
标签:name value var mockjs data Mock

mockjs

1、NodeJs安装

NodeJs安装(JavaScript)Node.js 安装包及源码下载地址为:https://nodejs.org/en/download/

如何检查?node --version

image-20221013162116461

2、MockJs安装

工作目录下安装MockJs

命令:npm install mockjs

image-20221013162509906

3、语法规范

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

注意:

  • 属性名生成规则 之间用竖线 | 分隔。
  • 生成规则 是可选的。
  • 生成规则,有 7 种格式:
    1. 'name|min-max': value
    2. 'name|count': value
    3. 'name|min-max.dmin-dmax': value
    4. 'name|min-max.dcount': value
    5. 'name|count.dmin-dmax': value
    6. 'name|count.dcount': value
    7. 'name|+step': value
  • 生成规则 的 含义 需要依赖 属性值的类型 才能确定。
  • 属性值 中可以含有 @占位符
  • 属性值 还指定了最终值的初始值和类型。

https://github.com/nuysoft/Mock/wiki/Syntax-Specification

4、官方demo

基础

// 使用 Mock
var Mock = require('mockjs')
var data = Mock.mock({
    // 属性 list 的值是一个数组,其中含有 1 到 10 个元素
    'list|1-10': [{
        // 属性 id 是一个自增数,起始值为 1,每次增 1
        'id|+1': 1
    }]
})

// 输出结果
console.log(JSON.stringify(data, null, 4))

C:\Program Files\nodejs\node.exe .\test.js
{
    "list": [
        {
            "id": 1
        },
        {
            "id": 2
        },
        {
            "id": 3
        }
    ]
}

数字

// 使用 Mock
var Mock = require('mockjs')
var data = Mock.mock({
    'number1|1-100.1-10': 1,
    'number2|123.1-10': 1,
    'number3|123.3': 1,
    'number4|123.10': 1.123
})

// 输出结果
console.log(JSON.stringify(data, null, 4))

C:\Program Files\nodejs\node.exe .\test2.js
{
    "number1": 66.04,
    "number2": 123.675,
    "number3": 123.225,
    "number4": 123.1233322535
}

正则

// 使用 Mock
var Mock = require('mockjs')
var data = Mock.mock({
    'regexp1': /[a-z][A-Z][0-9]/,
    'regexp2': /\w\W\s\S\d\D/,
    'regexp3': /\d{5,10}/
})

// 输出结果
console.log(JSON.stringify(data, null, 4))

C:\Program Files\nodejs\node.exe .\test3.js
{
    "regexp1": "oO6",
    "regexp2": "p$\rU2-",
    "regexp3": "653026"
}

占位符

// 使用 Mock
var Mock = require('mockjs')
var data = Mock.mock({
    name: {
        first: '@FIRST',
        middle: '@FIRST',
        last: '@LAST',
        full: '@first @middle @last'
    }
})
// 输出结果
console.log(JSON.stringify(data, null, 4))

C:\Program Files\nodejs\node.exe .\test4y.js
{
    "name": {
        "first": "Daniel",
        "middle": "Betty",
        "last": "Anderson",
        "full": "Daniel Betty Anderson"
    }
}

标签:name,value,var,mockjs,data,Mock
From: https://www.cnblogs.com/hery27/p/16789945.html

相关文章

  • mockjs语法基础
    mockjs官网mock.mock()Mock.mock(url?,type?,template|function(options))根据数据模板生成模拟数据。参数说明:url:可选。表示需要拦截的URL,可以是URL字符串或......
  • h5:vue3 + ts + vite + vuex + axios + vant4 + scss + postcss+mockjs+element-plus
    模板地址:https://gitee.com/zhang_meng_lei/mobile-template-h5-vue3/tree/master安装element-plus:yarnaddelement-plus(目前已导入但未实现代码)按需导入:https://el......
  • mockjs介绍
    一、为什么使用mockjs在做开发时,当后端的接口还未完成,前端为了不影响工作效率,手动模拟后端接口,1.我们可以使用json文件来模拟后台数据,但比较局限,无法模拟数据的增删改......
  • Mockjs使用
    src下新建mock文件夹,新建mockServe.js/*利用mockjs来mock数据接口*/importMockfrom'mockjs'importbannersfrom'./banners'importfloorsfrom'./floors'//......
  • MockJs
    MockJs一、为什么使用mockjs在做开发时,当后端的接口还未完成,前端为了不影响工作效率,手动模拟后端接口。1.我们可以使用json文件来模拟后台数据,但比较局限,无法模拟数据......