使用mockjs模拟后端返回的json数据;
前后端分离开发中最重要的一部就是前后端联调,很多时候后端进度是跟不上前端的,所以需要前端模拟一些数据进行调试,这样前端的进度就可以加快了。后端的小哥哥别打我;
使用mockjs可以很方便的模拟出想要的数据,只要后端字段给好,就可以模拟出数据,等到后端的数据接口真真好的时候可以直接将接口换掉;
使用方法;
一;安装json-server (ps:本人理解这是模拟一个后端服务器,到时候会开一个虚拟服务器出来)
npm install json-server –g
二;在项目中安装mockjs
npm install mockjs –save
三;在项目中建立目录mock ,并且增加mockjs文件,将如下代码写入文件中
var Mock = require('mockjs');
var Random = Mock.Random;
module.exports = function(){
var data2 = {
title:[]
};
for(var i = 0;i<20;i++){
var content = Random.cparagraph(0,10);
data2.title.push({
id:i,
title:Random.cword(20,30),
name:Random.cname(),
email:Random.email(),
color:Random.color(),
s:Random.region(),
q:Random.city( true )
})
}
return data2;
}
四;使用命令执行文件,运行服务
json-server mock/db.js;
ps:本人看文章学到的,项目中还没有具体使用
参考链接
https://zm12.sm-tc.cn/?src=l4uLj8XQ0IiIiNGckZ2TkJiM0ZyQktCHhp3Pzc3J0J6Ni5ack5qM0MjNzMvKz8jRl4uSkw%3D%3D&uid=e4391b419c0308e33c48eb4823b5515c&hid=e52b73bf962427b19f439c8ad15cc617&pos=1&cid=9&time=1526148679529&from=timeline&restype=1&pagetype=0020004000000408&bu=ss_doc&query=%E7%94%A8node+%E6%90%AD%E5%BB%BAmock&mode=&v=1&force=true&wap=false&uc_param_str=dnntnwvepffrgibijbprsvdsdichei
使用mockjs模拟后端返回的json数据;的更多相关文章
- 【转】Jquery ajax方法解析返回的json数据
转自http://blog.csdn.net/haiqiao_2010/article/details/12653555 最近在用jQuery的ajax方法传递接收json数据时发现一个问题,那就是返 ...
- 调试接口,返回的json数据,我定义了一个类,用来序列化,其中有一个字段定义为string 然后序列化的时候报错
调试接口,返回的json数据,我定义了一个类,用来序列化,其中有一个字段定义为string 然后序列化的时候报错 在需要解析的类型类上加上声明 eg:
- JS前端取得并解析后台服务器返回的JSON数据的方法
摘要:主要介绍:使用eval函数解析JSON数据:$.getJSON()方法获得服务器返回的JSON数据 JavaScript eval() 函数 eval(string) 函数可计算某个字符串,并执 ...
- HttpServletResponse 返回的json数据不是json字符串,而是json对象
今天在改一个bug 情况: 在spring boot中写了一个类Result ,用来统一封装 各个API响应结果 , 其中重写了toString()方法来返回 json字符串 . 在正常情况下,从其它 ...
- MOOC(3)- python发送请求,返回的json数据被转码
https://www.cnblogs.com/yoyoketang/p/10339210.html 问题:发送post请求,对post请求返回的json数据格式化,但是返回的结果被转码了 json. ...
- Core3.0返回的Json数据大小写格式问题
前言 测试发现,CoreWebAPI返回的Json数据,会将字段的首字母转换为小写, 经百度得,返回数据会默认驼峰命名,导致的. 随即百度, https://www.cnblogs.com/cdone ...
- vue+vuecli+webpack中使用mockjs模拟后端数据
前言 使用mockjs可以事先模拟数据,前提是和后端约定好了数据接口,怎样的数据.使用mock就可以生成你要的数据了,从而实现开发时前后端分离. 其主要功能是: 基于数据模板生成模拟数据. 基于HTM ...
- phpStudy4——前端页面使用Ajax请求并解析php返回的json数据
项目需求: 在html页面显示所有用户列表信息. 需求分析: 1. html页面使用ajax向后端php请求用户数据 2. php脚本查询数据库,并将查询后的结果以json格式返回前端html页面 3 ...
- jQuery提交Json数据到Webservice,并接收返回的Json数据
jQuery ajax webservice:get 和 post 一.GET 方式 客户端 复制代码 代码如下: var data = { classCode: "0001"}; ...
随机推荐
- html2canvas滚动截图
滚动截图 项目需求要进行动态的滚动截图搜索一下发现html2canvas可以实现截图,但是滚动截图网上搜罗了一遍发现不是很完善所以记录下 首先npm一下安装依赖: npm install html2c ...
- 如何实现 UITabbarController 的 State Preservation?
原文链接 最近在看ios programming - the big nerd ranch guide 这本书,其中第24章介绍了如何使用系统接口来实现 State Restoration. 示例部分 ...
- centeros 命令
一.查看系统时间.硬件时间 # date // 查看系统时间 #hwclock // 查看硬件时间 二.时间服务器上的时间同步的方法 安装ntpdate工具 # yum -y install ntp ...
- 拉格朗日插值法--python
数据插补 常见插补方法 插值法--拉格朗日插值法 根据数学知识可知,对于平面上已知的n个点(无两点在一条直线上可以找到n-1次多项式 ,使次多项式曲线过这n个点. 1)求已知过n个点的n-1次多项式: ...
- 软件工程homework-002
博客信息 沈阳航空航天大学计算机学院2020软件工程作业 作业要求 https://edu.cnblogs.com/campus/sau/Computer1701-1705/homework/1058 ...
- 2.7 C++STL list容器详解
文章目录 2.7.1 引入 2.7.2代码示例 2.7.3代码运行结果 总结 2.7.1 引入 STL list 容器,又称双向链表容器,即该容器的底层是以双向链表的形式实现的.这意味着,list 容 ...
- 前端面试题(react)
React 组件生命周期 在本章节中我们将讨论 React 组件的生命周期. 组件的生命周期可分成三个状态: Mounting:已插入真实 DOM Updating:正在被重新渲染 Unmountin ...
- 网站SQL注入防御实战
SQL注入作为直接威胁web业务的最严重攻击行为,已经被大多数的网站管理员所了解,这种通过HTTP标准端口,利用网页编码不严谨,提交精心构造的代码实现对数据库非授权访问的攻击方法,已经被越来越多的sc ...
- Java基础—字符串的比较
1."=="方法进行比较时有以下两种情况: 基础数据类型:比较的是数据值是否相同 引用类型:比较的是地址值是否相同 字符串是对象,它比较内容是通过一个方法实现的,equals() ...
- C++设计模式 - 迭代器模式(Iterator)
数据结构模式 常常有一-些组件在内部具有特定的数据结构,如果让客户程序依赖这些特定的数据结构,将极大地破坏组件的复用.这时候,将这些特定数据结构封装在内部,在外部提供统一的接口,来实现与特定数据结构无 ...