mockjs的常用方法分享

本文主要和大家分享mockjs的常用方法,结合文字和代码和大家讲解,希望能帮助到大家。

一.mock.mock()

根据数据模板生成模拟数据。更关键的是,我们发起Ajax请求的时候要能够接收到这些数据。这就是Mock.mock()的作用啦!

Mock.mock( rurl?, rtype?, template|function( options ) )

(1).参数的含义和默认值

参数 rurl:可选。表示需要拦截的 URL,可以是 URL 字符串或 URL 正则。例如 //domain/list.json/、’/domian/list.json’。
参数 rtype:可选。表示需要拦截的 Ajax 请求类型。例如 GET、POST、PUT、DELETE 等。
参数 template:可选。表示数据模板,可以是对象或字符串。例如 { ‘data|1-10’:[{}] }、’@EMAIL’。
参数 function(options):可选。表示用于生成响应数据的函数。
参数 options:指向本次请求的 Ajax 选项集。

(2).方法

2.Mock.mock( template )   根据数据模板生成模拟数据

3.Mock.mock( rurl, template )
记录数据模板。当拦截到匹配 rurl 的 Ajax 请求时,将根据数据模板 template 生成模拟数据,并作为响应数据返回。

4.Mock.mock( rurl, function( options ) )
记录用于生成响应数据的函数。当拦截到匹配 rurl 的 Ajax 请求时,函数 function(options) 将被执行,并把执行结果作为响应数据返回。

5.Mock.mock( rurl, rtype, template )
记录数据模板。当拦截到匹配 rurl 和 rtype 的 Ajax 请求时,将根据数据模板 template 生成模拟数据,并作为响应数据返回。

7.Mock.mock( rurl, rtype, function( options ) )
记录用于生成响应数据的函数。当拦截到匹配 rurl 和 rtype 的 Ajax 请求时,函数 function(options) 将被执行,并把执行结果作为响应数据返回。

(3).列子

  1. var data8 = Mock.mock(/.json/,"get",{    "name":"@name",    "isTrue|1":true,    "color":"@color"  })    Mock.mock(/.json/, 'post', function(options) {      return options.type  })  $.ajax({      url: 'hello.json',      type: 'get',      dataType: 'json'  }).done(function (data, status, jqXHR) {      $('
    ').text(JSON.stringify(data, null, 4))          .appendTo('body')  })    $.ajax({      url: 'hello.json',      type: 'post',      dataType: 'json'  }).done(function (data, status, jqXHR) {      $('
    ').text(JSON.stringify(data, null, 4))          .appendTo('body')  })
  2. 登录后复制

  3. 查看官网列子

  4. 二.Mock.Random

  5. Mock.Random 是一个工具类,用于生成各种随机数据

  6. (1).基本使用

  7. 1.Mock.Random.boolean() 返回一个随机的布尔值。

  8. 2.Random.natural() 返回一个随机的自然数(大于等于 0 的整数)

  9. 3.Random.integer()返回一个随机的整数。

  10. 4.Random.float()返回一个随机的浮点数。

  11. 5.Random.character()返回一个随机字符。

  12. 6.Random.string()返回一个随机字符串

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

  14. 查看官网

  15. (2).日期+时间

  16. 1.日期
    Random.date()  "2002-10-23"
    Random.date('yyyy-MM-dd')  // "1975-04-27"
    Random.date('yy-MM-dd')    //   "00-01-08"

  17. 2.时间:
    Random.time()   // "05:06:06"

  18. 3.日期和时间
    Random.datetime('yyyy-MM-dd A HH:mm:ss') 

  19. 4.当前的日期和时间 Ranndom.now()

  20. (3).模拟Web数据

  21. (4).模拟地理位置数据

  22. (5).颜色+文本+姓氏(名字)

  23. 请查看官网

  24. 三.Mock.valid( template, data )

  25. 校验真实数据 data 是否与数据模板 template 匹配。

  26. template 必选。  表示数据模板,可以是对象或字符串。例如 { 'list|1-10':[{}] }、'@EMAIL'
    data   必选。 表示真实数据。

  27. eg:

  28. var template = {    name: 'value1'}var data = {    name: 'value2'}Mock.valid(template, data)// =>[    {        "path": [            "data",            "name"        ],        "type": "value",        "actual": "value2",        "expected": "value1",        "action": "equal to",        "message": "[VALUE] Expect ROOT.name'value is equal to value1, but is value2"    }]
  29. 登录后复制

  30. 四.Mock.toJSONSchema( template )

  31. Mock.js 风格的数据模板 template 转换成 JSON Schema

  32. 五.Mock.setup()

  33. Mock.setup( settings ) 配置拦截 Ajax 请求时的行为。支持的配置项有:timeout

  34. 参数的含义和默认值
        settings  必选。配置项集合。
        timeout   可选。
         指定被拦截的 Ajax 请求的响应时间,单位是毫秒。值可以是正整数,例如 400,表示 400 毫秒 后才会返回响应内容;也可以是横杠 '-' 风格的字符串,例如 '200-600',表示响应时间介于 200  600 毫秒之间。默认值是'10-100'

  35. Mock.setup({
        timeout: 400
    })
    Mock.setup({
        timeout: '200-600'
    })

  36. 目前,接口 Mock.setup( settings ) 仅用于配置 Ajax 请求,将来可能用于配置 Mock 的其他行为。

  37. 以上就是mockjs的常用方法分享的详细内容,更多请关注【创想鸟】其它相关文章!

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。

点点赞赏,手留余香

给TA打赏
共0人
还没有人赞赏,快来当第一个赞赏的人吧!
    编程技术

    Vue中点击组件后即可关闭组件的实现方法

    2025-3-8 15:30:25

    编程技术

    vue.js怎么在标签属性中插入变量参数

    2025-3-8 15:30:31

    0 条回复 A文章作者 M管理员
    欢迎您,新朋友,感谢参与互动!
      暂无讨论,说说你的看法吧
    个人中心
    购物车
    优惠劵
    今日签到
    私信列表
    搜索