mock.js 模拟数据
1. 劫持请求,返回模拟数据: 用于前后台对接前数据模拟
相比于静态json文件而言:代码完成后不必修改源文件对应的接口调用、可模拟增删改查
2.实例代码
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script src="https://common.cnblogs.com/script/jquery.js"></script>
<script src="http://mockjs.com/dist/mock.js"></script>
<script type="text/javascript">
// mock
Mock.mock('http://seed.gtafe.com:9998/Account/Login', {
'name': '@name',
'age|1-100': 100,
'city': '@city'
}); </script>
<script>
// code
$.ajax({
url: 'http://seed.gtafe.com:9998/Account/Login',
dataType: 'json'
}).done(function(data, status, xhr) {
console.log(data, status, xhr);
console.log(
JSON.stringify(data, null, 4)
)
});
</script> </body>
</html>
3.相关文章
mock.js 模拟数据的更多相关文章
- dva框架使用mock.js模拟数据 + fetch请求数据
what DVA? Dva是基于Redux做了一层封装,对于React的state管理,有很多方案,我选择了轻量.简单的Dva. dva 可以很方便就使用mock.js进行数据的模拟. 只需要三步,即 ...
- Vue笔记:使用 mock.js 模拟数据
在我们的项目实际开发过程中,后端的接口往往是较晚才会提供出来,并且还要写接口文档,如果前端的开发都要等到接口开发完成才开始就非常影响项目整体开发进度了,mock.js 的出现使前后端分离并行开发成为可 ...
- axios + mock.js模拟数据实现前后端分离开发的实例代码
首先就是必须安装axios和mock.js npm install axios npm install mockjs 1. 然后在文档src中新建一个mock.js文件,如图 2. 在main.js中 ...
- Vue+Mock.js模拟登录和表格的增删改查
有三类人不适合此篇文章: "喜欢站在道德制高点的圣母婊" -- 适合去教堂 "无理取闹的键盘侠" -- 国际新闻版块欢迎你去 "有一定基础但又喜欢逼逼 ...
- mock.js模拟ajax数据请求
在我们开发过程中存在着前端页面ui完成了,但是没有接口进行联调数据的情况,现在介绍一下用mock.js来完成数据的请求.这样在后期我们的后台接口完成后只需要更改请求的接口名字即可!前提是你的模拟字段名 ...
- mock.js模拟生成假数据
mock使用方法很简单, 下面是简单的用法, 详细的用法可以看官方文档, 写的很清楚, 下面的代码直接拷贝到本地html文件, 双击打开即可生成你想要的数据 <!DOCTYPE html> ...
- vue中使用axios(异步请求)和mock.js 模拟虚假数据
一.使用axios 1.安装 npm install --save axios 2.引用 import Axios from 'axios' Vue.prototype.Axios = Axios 二 ...
- vue 使用mock来模拟数据
首先,需要安装mock npm install mockjs --save-dev 在main.js中引入mock mock文件写法如下: const Mock = require('mockjs') ...
- jQuery mock.js模拟的使用
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
随机推荐
- tomcat8踩坑:url包含|等特殊字符报错400的问题
这个问题纠缠了我很久了,终于在今天早上解决了,感谢自己的不放弃和不断尝试的决心,我坚信,我可以找到解决方式!! 项目用的spring boot+spring security框架,关于统一错误页面在开 ...
- javascript字符串转数字
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- mongoDB 安装过程
1.在官方网站下载 mongoDB的安装包,我下载的是3.4.6 系统为win10_64 2.需要安装vc++2015 在安装时发现 win7 系统安装不了. 不得已才安装的win10 3.安装mo ...
- 阶段3 3.SpringMVC·_04.SpringMVC返回值类型及响应数据类型_2 响应之返回值是String类型
返回字符串 新建一个response的页面 新建后台Controller类 视图解析器配置的前缀地址 是WEB-INF下的pages下的页面. 创建pages文件夹在下面创建success.jsp页面 ...
- Linux Shell 中 > 和 >> 的异同点和应用场景
Linux Shell 中 > 和 >> 的异同点和应用场景 > 和 >> 的异同点 举例说明(start.sh 为某个服务的启动脚本,start.log 为某服务 ...
- Jquery(DOM和选择器)
O(∩_∩)O~~~,今天简单整理了一下最近所学的Jquery知识.下面就总结一下. 首先,对于Jquery我们需要简单了解下: 1.Jquery是开放源代码的JS库, 2.Jquery操作是函数式编 ...
- 【ABAP系列】SAP Smartforms 设置纸张打印格式
公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[ABAP系列]SAP Smartforms 设 ...
- PHP 註解規則使用方式
/** * 函數名稱 * 函數描述(有些會含HTML代碼) * * @access 變數可存取的權限 (Example: Public or Private) * @api 爲第三方來源的變數 * @ ...
- Xing: The Land Beyond — 从课堂到 Steam* 的卓越之旅
Xing:The Land Beyond 的诞生最初源于大学的一个关卡设计课程,之后才登录 Kickstarter* 平台,采用虚拟现实技术,并由 Sony* 带到电子娱乐展览会.这个设计任务本来计划 ...
- Kinect数据
原文链接 Kinect V1 和 V2 比较 Kinect V1 和 V2 的外观比较 Kinect V1 和 V2 的参数比较 Kinect V1 和 V2 随距离增加的误差分布 Kinect V1 ...