V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
apifox
V2EX  ›  前端开发

Mock 语法讲解

  •  
  •   apifox · 2023-04-14 17:25:40 +08:00 · 906 次点击
    这是一个创建于 618 天前的主题,其中的信息可能已经有所发展或是发生改变。

    Mock 是生成随机数据,拦截 Ajax 请求的 JavaScript 库。

    本文来介绍下 Mock 的常用语法。

    模拟数据

    生成随机数据

    Mock.Random.boolean()

    生成一个随机的布尔值。例如:

    返回值为 truefalse

    Mock.Random.integer(min, max)

    生成一个随机的整数,可以指定范围。例如:

    返回值为 010 之间的整数。

    Mock.Random.float(min, max, dmin, dmax)

    生成一个随机的浮点数,可以指定范围和精度。例如:

    返回值为 0.00100.00000 之间的浮点数,精度为 25 位小数。

    Mock.Random.string(length)

    生成一个随机的字符串,可以指定长度。例如:

    返回值为长度为 10 的随机字符串。

    Mock.Random.date()

    生成一个随机的日期。例如:

    返回值为随机日期的字符串表示,例如 "1977-07-03"

    Mock.Random.time()

    生成一个随机的时间。例如:

    返回值为随机时间的字符串表示,例如 "05:38:02"

    Mock.Random.datetime()

    生成一个随机的日期时间。例如:

    返回值为随机日期时间的字符串表示,例如 "2007-06-29T22:03:06.140Z"

    Mock.Random.image(size, background, foreground, format, text)

    生成一个随机的图片,可以指定大小、背景色、前景色、格式和文字。例如:

    返回值为图片的 Base64 编码字符串。

    生成数据模板指定的数据

    Mock.mock(template) 根据数据模板生成模拟数据。数据模版可以生成复杂的数据结构。

    数据模版的语法如下:

    • 属性名和属性值之间用 : 分隔。
    • 属性与属性之间用 , 分隔。
    • 属性值是字符串类型,可以使用 @ 来表示占位符。
    • 属性值是对象类型,可以使用 name|rule 来表示生成规则。

    示例:

    const Mock = require('mockjs')
    
    const data = Mock.mock({
      'list|1-10': [{
        'id|+1': 1, // 从 1 开始,每次加 1
        'name': '@cname', // 随机中文名字
        'age|18-60': 1, // 18 到 60 岁之间的整数
        'gender|1': ['男', '女'], // 男或女
        'email': '@email' // 随机电子邮件地址
      }]
    })
    
    console.log(data)
    

    输出:

    {
      "list": [
        {
          "id": 1,
          "name": "林志玲",
          "age": 32,
          "gender": "女",
          "email": "[email protected]"
        },
        {
          "id": 2,
          "name": "周杰伦",
          "age": 55,
          "gender": "男",
          "email": "[email protected]"
        },
        ...
      ]
    }
    

    模拟接口

    • Mock.mock(url, template) 根据接口地址和数据模板模拟接口请求。
    • Mock.mock(method, url, template) 根据请求方法、接口地址和数据模板模拟接口请求。

    以上是 Mock 中常用的语法,更多语法请查阅官方文档。

    知识扩展:

    更多 Mock 相关知识可点击下方链接查看。

    litujin1123
        1
    litujin1123  
       2023-06-04 21:09:59 +08:00 via iPhone
    站点直接被拦截跳转去其他乱七八糟的了
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   888 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 20:19 · PVG 04:19 · LAX 12:19 · JFK 15:19
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.