前端Mockjs学习笔记,持续记录

2,441次阅读
没有评论

共计 610 个字符,预计需要花费 2 分钟才能阅读完成。

相比于自己写一个模拟数据返回的后端接口,好像还是这个来的更加方便。

什么是 mockjs

让前端攻城师独立于后端进行开发。不需要修改既有代码,就可以拦截 Ajax 请求,返回模拟的响应数据。支持生成随机的文本、数字、布尔值、日期、邮箱、链接、图片、颜色等。

基于对 window 的 xhr 对象的二次封装,增加了用于拦截的逻辑。

开始使用

1. 安装

npm install mockjs

2. 指定拦截 ajax 请求时的响应时间

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

3. 指定拦截的规则和返回数据

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

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

4. 生成随机数据

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

相关例子:http://mockjs.com/examples.html 

    正文完
     0
    Yojack
    版权声明:本篇文章由 Yojack 于2022-04-19发表,共计610字。
    转载说明:
    1 本网站名称:优杰开发笔记
    2 本站永久网址:https://yojack.cn
    3 本网站的文章部分内容可能来源于网络,仅供大家学习与参考,如有侵权,请联系站长进行删除处理。
    4 本站一切资源不代表本站立场,并不代表本站赞同其观点和对其真实性负责。
    5 本站所有内容均可转载及分享, 但请注明出处
    6 我们始终尊重原创作者的版权,所有文章在发布时,均尽可能注明出处与作者。
    7 站长邮箱:laylwenl@gmail.com
    评论(没有评论)