mock.js 和easy-mock使用
mock.js
1.项目中引入mock.js
<script src="../static/js/mock.js" type="text/javascript"></script>
2.引入拦截Ajax的js,自己命名,我的是myMock.js
Mock.mock("/getLoginUserId", "get", {
"code": 0, "data": 1, "dataDesc": null, "msg": "操作成功"
});
3.进行Ajax调用
this.$http.get('/getLoginUser')
.then(function (res) {
console.log(res)
//{"code": 0, "data": 1, "dataDesc": null, "msg": "操作成功"}
}, function (err) {
console.log(err);
});
注意:带有参数的get请求使用正则匹配url(例如url="/getUserDetail?userId=123")
url这样写RegExp("/getUserDetail" + ".*")
easy-mock
1.打开easy-mock官网,https://www.easy-mock.com/,点击加号

2.进入创建页面,创建项目

3.创建后会跳到首页,点击刚才创建的项目,进入后创建接口

4.填写这些内容后创建

5.然后就可以访问该接口地址了

mock.js 和easy-mock使用的更多相关文章
- 使用移动自适应布局+easy mock实现移动界面的简单实现
一.使用easy mock模拟数据 easy mock链接地址 二.自己写移动自适应布局 自己编写主要是利用rem进行宽度栅格布局: html { /* 相当于一个界面适配器,pc以及移动端都可以进行 ...
- 前后端分离开发——模拟数据mock.js
mock.js 生成模拟数据,拦截ajax请求 <script type="text/javascript" src="http://libs.baidu.com/ ...
- 【mock.js】后端不来过夜半,闲敲mock落灯花 ——南宋·赵师秀
mock的由来[假] 赵师秀:南宋时期的一位前端工程师 诗词背景:在一个梅雨纷纷的夜晚,正值产品上线的紧张时期,书童却带来消息:写后端的李秀才在几个时辰前就赶往临安度假去了, 赵师秀非常生气 ...
- Mock.js——数据模板定义
1. 安装 npm install mockjs --save-dev //安装开发依赖 2. 数据模板定义规则 Mock.mock({...}) String: 'string|num1-num2' ...
- 使用node.js + json-server + mock.js 搭建本地开发mock数据服务
在开发过程中,前后端不论是否分离,接口多半是滞后于页面开发的.所以建立一个REST风格的API接口,给前端页面提供虚拟的数据,是非常有必要的.对比过多种mock工具后,我最终选择了使用 json se ...
- RAP、Mock.js、Vue.js、Webpack
最近做项目使用的是RAP1的接口,但是昨天开始,RAP1 出现了问题,接口都不能用了. 所以补充一下Mock.js的用法,以便在这种突发的情况时候时自己通过Mock的方式来处理接口. npm init ...
- 让前端攻城师独立于后端进行开发: Mock.js
一.Mock.js是什么? 目前的大部分公司的项目都是采用的前后端分离, 后端接口的开发和前端人员是同时进行的. 那么这个时候就会存在一个问题, 在页面需要使用大量数据进行渲染生成前, 后端开发人员的 ...
- Mock.js数据模拟
数据来源方式: 为什么要用mockjs 实际开发中,前后端分离,前端需要后端的接口去完成页面的渲染,但是并不能等到后端成员写完接口再开始进行测试.大部分情况下,前后端需要同时进行开发.因此便需要moc ...
- 【重点突破】—— Easy Mock的使用及Mock.js规范
前言:在线使用Easy Mock可视化工具,可以提供快速生成“模拟数据”的持久化服务: Mock.js是一个JS插件,指定了一套规范,而Easy Mock工具就遵循这些规范. 一.Easy Mock ...
- 小程序——使用Easy Mock
使用Easy Mock 一.什么是Easy Mock Easy Mock 是一个可视化的能快速生成模拟数据的持久化服务.在实际开发中常见的Mock方式一般是将模拟数据直接写在代码里,利用Java ...
随机推荐
- java里split(" {1,}")什么意思啊?
将字符串按照括号内的内容分割成字符数组这里括号内是正则表达式,X{m,n}代表X至少重复m次,至多重复n次这里空格至少重复1次,就是将字符串以一个或多个空格分割如"1 2 ab c" ...
- Avoided redundant navigation to current location: "/users"
问题产生的原因:在Vue导航菜单中,重复点击一个菜单,即重复触发一个相同的路由,会报错,但不影响功能 解决:在router的配置文件中加入如下代码: const originalPush = Rout ...
- 数据结构实训——哈夫曼(Huffman)编/译码器
题目4.哈夫曼(Huffman)编/译码器(限1人完成) [问题描述] 利用哈夫曼编码进行通信可以大大提高信道利用率,缩短信息传输时间,降低传输成本.但是,这要求在发送端通过一个编码系统对待传数据预先 ...
- new Date在不同浏览器识别问题
原文 http://www.cnblogs.com/yangxiaopei/articles/4708157.html 4. 正确的做法 以下列出正确的做法: var time1 = (timesta ...
- 百度ping工具
function postUrl($url, $postvar) { $ch = curl_init(); $headers = array( "POST".$url." ...
- IDM中的选项设置你了解多少?
IDM(Internet Download Manager)下载器能够兼容支持多种浏览器进行文件下载,很多时候只要复制一个地址IDM的下载弹窗就自动弹出来,有时候不需要下载的时候也会弹,时间久了就会感 ...
- 借助Mac自带的强大的搜索功能,如何快速搜索打开Tuxera Disk Manager
现在很多小伙伴们在遇到Mac读写NTFS格式硬盘问题的时候,都会选择使用Tuxera NTFS这个磁盘读写工具.因为这款读写工具不仅可以帮助我们进行读写工作,还具有一个磁盘管理工具Disk Manag ...
- react-hash-calendar,移动端日期时间选择插件
按照惯例,先上效果图 vue 版本同款日历:https://github.com/TangSY/vue-hash-calendar react-hash-calendar 支持手势滑动操作 上下滑动 ...
- 解决-Chrome插件安装时程序包无效:"CRX_HEADER_INVALID"
最近安装新的谷歌插件出现 :程序包无效:"CRX_HEADER_INVALID" 原因如下: 在地址栏输入chrome://settings/help 如果,你的 Chrome 浏 ...
- P2592 [ZJOI2008]生日聚会
容易发现已经结束掉的一个子串只要合法就对后面没有影响,所以可以令 \(f_{i,j,p,q}\) 表示前 \(i+j\) 个人有 \(i\) 个男孩,\(j\) 个女孩,所有后缀中男孩最多比女孩多 \ ...