使用mockjs模拟分页请求
2024-09-04 18:27:39
首先安装mockjs
npm install mockjs --save-dev
创建mock.js
//mock.js
const Mock = require("mockjs");
// const Random = Mock.Random // Mock.Random 是一个工具类,用于生成各种随机数据
const dataList = []
//用于接受生成数据的数组
for (let i = 0; i < 50; i++) { // 可自定义生成的个数
const template = {
"roleId": i,
"name": "admin" + i,
"remark": "超级管理员" + i,
"createBy": null,
"createTime": "2018-08-14T03:11:11.000+0000",
"lastUpdateBy": null,
"lastUpdateTime": null,
"delFlag": 0
}
dataList.push(template)
}
Mock.mock(/role\/query/, 'post', (params) => { //三个参数。第一个路径,第二个请求方式post/get,第三个回调,返回值
var info = JSON.parse(params.body)
var [index, size, total] = [info.params.pageIndex, info.params.pageSize, dataList.length]
var len = total / size
var totalPages = len - parseInt(len) > 0 ? parseInt(len) + 1 : len
var newDataList = dataList.slice((index - 1) * size, index * size)
return {
'code': '0',
'message': 'success',
'data': {
'pageIndex': index,
'pageSize': size,
'content': newDataList,
'total': total,
'totalPages': totalPages,
}
}
})
在main.js中引入mock.js
import './mock/index.js'
在组件中模拟请求
//role.vue
methods: {
// 获取数据
async getSysRoleData () {
try {
const url = '/role/query';
const { data: res } = await this.$http[4].post(url, {
params: {
pageIndex: this.query.pageIndex,
pageSize: this.query.pageSize
}
});
console.log("角色管理列表:", res.data)
} catch (err) {
console.dir(err);
this.$message.error({
message: err.message,
duration: 1500
});
}
},
}
最新文章
- 《连载 | 物联网框架ServerSuperIO教程》2.服务实例的配置参数说明
- Sublime Text 3使用参考手册
- [再寄小读者之数学篇](2014-11-19 $\sin x/x$ 在 $(0,\pi/2)$ 上递增)
- ORACLE里的自增字段设置
- JS获取客户端IP地址、MAC和主机名七种方法
- append, appendTo, after区别(preappend、before与这几个原理相同)
- 【翻译】FreeMarker——入门
- android:自己定义组合控件Weight(高仿猫眼底部菜单条)
- 七 Struts2 文件上传和下载
- Docker入门-docker-compose使用(二)
- Datatables插件1.10.15版本服务器处理模式ajax获取分页数据实例解析
- windows服务安装,卸载
- 多元线性回归(Multivariate Linear Regression)简单应用
- python模块之os模块
- linux space/mark设置
- 潭州课堂25班:Ph201805201 第十五课 迭代器,生成器 (课堂笔记)
- Codeforces 786 C. Till I Collapse
- 重新配置dbconsole的步骤
- STL - 容器 - Map(一)
- 带入gRPC:gRPC Streaming, Client and Server