一、基础

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. customer.java

    package banking; public class Customer { private String firstName; private String lastName; private ...

  2. day_6.20动态加载py文件

    __import__() 魔法方法! 关于动态网站打开的  代码流程!

  3. E - Cup

    The WHU ACM Team has a big cup, with which every member drinks water. Now, we know the volume of the ...

  4. centos下nginx的启动

    今天下载了个nginx,编译安装之后,无法启动,以前的启动方法无法实现(services nginx start), 在网上找了半天,才找到一个方法,与大家分享: 命令如下: 启动:/usr/loca ...

  5. mapper.xml

    #{}如果是字符串就不用加引号,否则报错,${}也一样,不是占位符需要加

  6. python 给字符串加颜色

    msg = '\033[41;1m字符串内容\033[0m' print(msg) # \033[41;1m起始位置 改变41数值就是改变其他颜色,.033[0m 结束位置

  7. 扒来的lstdc++.6.0.9有效解决方案

    找到了Xcode10模拟器和真机运行的办法了1.将libstdc++_sim.zip解压,放到目录 /Applications/Xcode.app/Contents/Developer/Platfor ...

  8. day0311 深浅copy

    1.赋值运算 l1 = [1,2,3,['barry','alex']] l2 = l1 l1[0] = 111 print(l1) # [111, 2, 3, ['barry', 'alex']] ...

  9. [development][http][libhtp] suricata的http库--libhtp

    首先,从文档来看, 它支持管道化的http, 也可以说过于重量级. 其次, 还没有达到产品化的稳定性. 并不是完全对应我的需求, http模块是一个整体性能相关模块. 应该按需定制更合理. 但是,功能 ...

  10. python的一些基本概念知识和面试题

    对于机器学习算法工程师而言,Python是不可或缺的语言,它的优美与简洁令人无法自拔.那么你了解过Python编程面试题吗?从Python基础到网页爬虫你是否能全方位Hold住?今天,机器之心为读者们 ...