mock模拟后台数据
import Mock from 'mockjs'
const Random = Mock.Random // 获取random对象,随机生成各种数据,具体请翻阅文档
const domain = 'http://mockjs.com/api' // 定义默认域名,随便写
const code = 200 // 返回的状态码const postData = function(req) {
let listData=[]
let totalSize = 30
let pagination = JSON.parse(req.body)
let pageSize = pagination.pageSize;
// 随机生成数据
for (let i = 0; i < pageSize; i++) {
let post = {
id: i,
pfbmc: Random.name(),
pshdmc: Random.csentence(10, 25), // 随机生成名字
pshdsj: Random.date() + ' ' + Random.time(), // 随机生成年月日 + 时间
zt: "启用"
}
listData.push(post)
}
return { // 返回状态码和文章数据posts
code,
result:1,
info:{list:listData,totalSize: totalSize,}
}
}
Random.extend({
name: function() {
var name = ['关于智能手机的评分表', '关于as的评分表', '关于saw的评分表', '关于wqwq的评分表', '关于gtrg的评分表', '任正非回应退休', '新发展理念', '20字好干部标准', '五位一体', '强富美高', '供给侧结构性改革', '三解三促','三会一课','四个进一步','三次大讨论','三个新成效','五查摆五强化','两聚一高','抓项目、转作风、促发展','三工程一计划']
return this.pick(name) //pick:从list中随机选取一个元素
},
})
Mock.mock(`${domain}/gridTable/posts`, /get|post/i, postData); // 定义请求链接,类型,还有返回数据
//删除数据
const list = function (options) {
let rtype = options.type.toLowerCase(); //获取请求类型
switch (rtype) {
case 'get':
break;
case 'post':
let id = parseInt(JSON.parse(options.body).id) //获取删除的id
listData = listData.filter(function(val){
return val.id!=id;//把这个id对应的对象从数组里删除
});
break;
default:
}
return {
code,
info:{list:listData}
} //返回这个数组,也就是返回处理后的假数据
}
Mock.mock(`${domain}/deletes`,/get|post/i, list);//删除数据
mock模拟后台数据的更多相关文章
- Mock模拟后台数据接口--再也不用等后端的API啦
ok,在开发中经常需要从后台获取数据,那么有时候后台的数据接口并没有写好,所以这时候,就需要自己模拟数据接口,来实现前端逻辑, 今天数的就是阿里巴巴的一款mock产品,很好用的哦!!!! ok!这是我 ...
- 深入浅出的webpack4构建工具--webpack4+vue+vuex+mock模拟后台数据(十九)
mock的官网文档 mock官网 关于mockjs的优点,官网这样描述它:1)可以前后端分离.2)增加单元测试的真实性(通过随机数据,模拟各种场景).3)开发无侵入(不需要修改既有代码,就可以拦截 A ...
- vue mock(模拟后台数据) 最简单实例(一)——适合小白
开发是前后端分离,不需要等待后台开发.前端自己模拟数据,经本人测试成功. 我们在根目录新建存放数据的json文件,存放我们的数据data.json //data.json{ "status& ...
- vue mock(模拟后台数据) +axios 简单实例(二)
需装上axios,build文件夹中webpack.dev.conf.js文件添加上vue mock配置的东东, 如,继(一) //组件<template> <div> &l ...
- mock数据(模拟后台数据)
mock数据(模拟后台数据) - Emily恩 - 博客园 https://www.cnblogs.com/enboke/p/vue.html Mock.js http://mockjs.com/ 前 ...
- express+mockjs实现模拟后台数据发送
前言: 大多数时候,前端会和后端同时进行开发,即在我们开发完页面的时候,很可能还不能立马进入联调阶段,这个时候,为了保证我们接口的有效性和代码的功能完整,我们可能需要模拟数据. 模拟数据方法 1.通过 ...
- vue-cli模拟后台数据交互
作为一个前端入坑的妹子,在学习vue的道路上挣扎徘徊,由一开始的对vue一直蒙圈只知道双向数据绑定和一些'V-x'的指令,慢慢通过一个视频的学习渐渐入坑,对于我这个js基础不怎么好而且编程思维又不是很 ...
- iBase4j前端01_bootstrap-suggest json-server模拟后台数据、bootstrap-suggest环境搭建、开启bootstrap-suggest的post和put请求
1 准备 1.1 模拟的json数据 { "info": [ { "message": "信息", "value": [ ...
- 超简单本地mock假数据测试,模拟后台数据返回必杀技
温馨提示:急性子可以直接拉到最后观看方法步骤. 什么是mock? mock就是在开发过程中,对于某些不容易构造或者不容易获取的对象,用一个虚拟的对象来创建以便测试开发的方法. 使用mock有什么好处? ...
随机推荐
- appium 环境准备
一.环境准备 1.相关依赖环境 当前的环境是Windows 10版本 64位系统(32位的自己想办法吧) 1.jdk1.6.0 (64位) --最好1.6以上版本 2 ...
- SpringBoot指定额外需要扫描的包
我们都知道,SpringBoot主启动类标注了@SpringBootApplication注解,该注解引入了@ComponentScan注解 所以默认的包扫描规则是,程序会自动扫描主启动类所在包及其子 ...
- 【转载】关于SimpleDateFormat安全的时间格式化线程安全问题
想必大家对SimpleDateFormat并不陌生.SimpleDateFormat 是 Java 中一个非常常用的类,该类用来对日期字符串进行解析和格式化输出,但如果使用不小心会导致非常微妙和难以调 ...
- Objective-C和 C++ 混编的要点
Using C++ With Objective-C苹果的Objective-C编译器允许用户在同一个源文件里自由地混合使用C++和Objective-C,混编后的语言叫Objective-C++.有 ...
- c++线程同步之信号量
// MutexExDlg.h : 头文件 // #pragma once // CMutexExDlg 对话框 class CMutexExDlg : public CDialogEx { // 构 ...
- 关于Tomcat服务器中的协议及请求过程
关于Tomcat服务器中采用的协议:在Tomcat的server.xml文件中可以找到如下几个Connector <!-- 1. HTTP --> <Connector port=& ...
- 将Centos7的yum配置为阿里云的镜像(完美解决yum下载太慢的问题)
2017-02-17 16:02:30 张老湿 阅读数 13768 http://mirrors.aliyun.com/help/centos?spm=5176.bbsr150321.0.0. ...
- SecureCRT中文乱码解决已设置UTF-8了
参考网址:http://www.iitshare.com/securecrt-chinese-garbled-solution.html 问题描述 SecureCRT与SecureFX的常规选项里面已 ...
- kubernetes-使用Nginx配置ingress-controllers
下载 Nginx Ingress Controller 配置文件: wget https://raw.githubusercontent.com/kubernetes/ingress-nginx/ma ...
- 分布式结构化存储系统-HBase应用案例
分布式结构化存储系统-HBase应用案例 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 为了让读者更进一步了解HBase在实际生成环境中的应用方法,在董西成的书里介绍两个经典的HB ...