一、基础

1.1、安装  

//安装
npm install mockjs --save

1.2、使用

// 使用 Mock
var Mock = require('mockjs')
Mock.mock(/\.json/ , {
// 属性 list 的值是一个数组,其中含有 1 到 10 个元素
'list|1-10': [{
// 属性 id 是一个自增数,起始值为 1,每次增 1
'id|+1': 1
}]
})
$.ajax({
url: 'hello.json',
dataType: 'json',
}).done(function(data, status, jqXHR) {
console.log(res)
})

  上面的ajax请求的是hello.json里面的数据,但是经过mock在拦截他返回了mock随机生成的list列表,如下

{
"list": [
{
"id": 1
},
{
"id": 2
},
{
"id": 3
},
{
"id": 4
},
{
"id": 5
},
{
"id": 6
}
]
}

001-mock.js安装使用的更多相关文章

  1. mock.js

    mock.js http://mockjs.com/ https://github.com/nuysoft/Mock/wiki 为了完成angularjs的karma测试,看到这个好东东,这货能拦截a ...

  2. Mock.js:前后端分离开发工具

    概述 Mock.js实现的功能 基于 数据模板 生成数据 基于 HTML模板 生成数据 拦截并模拟 Ajax请求 用法 浏览器: <!-- (必选)加载 Mock --> <scri ...

  3. 【mock.js】后端不来过夜半,闲敲mock落灯花 ——南宋·赵师秀

      mock的由来[假]   赵师秀:南宋时期的一位前端工程师 诗词背景:在一个梅雨纷纷的夜晚,正值产品上线的紧张时期,书童却带来消息:写后端的李秀才在几个时辰前就赶往临安度假去了,  赵师秀非常生气 ...

  4. axios + mock.js模拟数据实现前后端分离开发的实例代码

    首先就是必须安装axios和mock.js npm install axios npm install mockjs 1. 然后在文档src中新建一个mock.js文件,如图 2. 在main.js中 ...

  5. vue-cli+mock.js+axios模拟前后台数据交互

    最近工作不是很忙,自己做了一个vue的移动端的小项目,涉及到后台数据的时候,网上查阅了一些资料,因为是自己写的项目没有后台只能自己模拟数据,刚开始就自己写了一些静态数据后来觉得尽量模拟真实的比较好些, ...

  6. 一统江湖的大前端(2)—— Mock.js + Node.js 如何与后端潇洒分手

    <一统江湖的大前端>系列是自己的前端学习笔记,旨在介绍javascript在非网页开发领域的应用案例和发现各类好玩的js库,不定期更新.如果你对前端的理解还是写写页面绑绑事件,那你真的是有 ...

  7. 用node.js启动mock.js

    Node.js Node 是一个让 JavaScript 运行在服务端的开发平台,它让 JavaScript 成为与PHP.Python.Perl.Ruby 等服务端语言平起平坐的脚本语言.官网下载n ...

  8. Mock.js——数据模板定义

    1. 安装 npm install mockjs --save-dev //安装开发依赖 2. 数据模板定义规则 Mock.mock({...}) String: 'string|num1-num2' ...

  9. Mock.js 虚拟接口 数据模拟

    Mock.js 是一款前端开发中拦截Ajax请求再生成随机数据响应的工具.可以用来模拟服务器响应. 优点是非常简单方便, 无侵入性, 基本覆盖常用的接口数据类型. 大概记录下使用过程, 详细使用可以参 ...

  10. 使用node.js + json-server + mock.js 搭建本地开发mock数据服务

    在开发过程中,前后端不论是否分离,接口多半是滞后于页面开发的.所以建立一个REST风格的API接口,给前端页面提供虚拟的数据,是非常有必要的.对比过多种mock工具后,我最终选择了使用 json se ...

随机推荐

  1. [Localization] YOLO: Real-Time Object Detection

    Ref: https://pjreddie.com/darknet/yolo/ 关注点在于,为何变得更快? 论文笔记:You Only Look Once: Unified, Real-Time Ob ...

  2. 19迭代模式Iterator

    一.什么是迭代模式 Iterator模式也叫迭代模式,是行为模式之 一,它把对容器中包含的内部对象的访问委让给 外部类,使用Iterator(遍历)按顺序进行遍历 访问的设计模式. 二.不使用迭代模式 ...

  3. WPF之Menu绑定XML

    一.XML文件 <?xml version="1.0" encoding="utf-8" ?> <MenuData xmlns="& ...

  4. HttpWatch工具简介及使用技巧

    一 概述: HttpWatch强大的网页数据分析工具.集成在Internet Explorer工具栏.包括网页摘要.Cookies管理.缓存管理.消息头发送/接受.字符查询.POST 数据和目录管理功 ...

  5. 使用Python管理压缩包

    一. 使用tarfile库读取与创建tar包 1. 创建tar包 In [1]: import tarfile In [2]: with tarfile.open('demo.tar',mode='w ...

  6. 看看大网站都用什么操作系统和Web服务器

    以下内容为网络上转载总结,不是很准确 Google 用哪些软件做 Web Server? 除了有两个节点操作系统看出来是 Linux 外,其他的都是未知的. Web 服务器用的都是 GWS ? 我估计 ...

  7. js -【 数组】判断一个变量是数组类型的几种方法

    怎么判断一个数组是数组呢? 其实这个也是一个常考的题目.依稀记得我为数不多的面试经过中都被问道过. 方案一: instanceof variable instanceof Array 解决思路: 使用 ...

  8. Xcode连接TFS Git用户名和密码不正确解决方案

    团队要将原来搭建的Git服务全部迁移到TFS的Git上统一管理,迁移的过程非常顺利.当要用Xcode或者SourceTree连接TFS Git(我们的TFS身份认证是基于Windows的,使用HTTP ...

  9. Solve error LNK2001 about pcl::io::vtkPolyDataToPointCloud

    When use function 'pcl::io::vtkPolyDataToPointCloud' in PCL 1.6.0, one may have error as follows: &g ...

  10. AJAX返回总是ERROR或是没有数据的问题

    如果总是到ERROR,是因为async没有定义为false,设置为同步,数据类型要设置为text,不要用json. 示例: if (IDcard != "") { $.ajax({ ...