easyui 列表展示 如何解析 ResponseEntity<Page<Monthlycoefficient>> 这样的返回结构

在使用 EasyUI 展示列表数据时,通常需要将后端返回的数据解析为 EasyUI 数据网格(datagrid)所需的格式。假设你的后端返回的是一个 ​​ResponseEntity<Page<MonthlyCoefficient>>​​​ 结构,其中 ​​Page​​​ 是 Spring Data 的分页对象,​​MonthlyCoefficient​​ 是你定义的实体类。

以下是一个示例,展示如何在前端解析并展示这个数据结构:

后端部分(Spring Boot)

假设你有一个控制器方法返回 ​​ResponseEntity<Page<MonthlyCoefficient>>​​:

@RestController
@RequestMapping("/coefficients")
public class MonthlyCoefficientController {@Autowiredprivate MonthlyCoefficientService monthlyCoefficientService;@GetMappingpublic ResponseEntity<Page<MonthlyCoefficient>> getCoefficients(Pageable pageable) {return ResponseEntity.ok(monthlyCoefficientService.getCoefficients(pageable));}
}
前端部分(EasyUI)

在前端,你需要解析 ​​ResponseEntity<Page<MonthlyCoefficient>>​​ 并将其转换为 EasyUI 数据网格所需的格式。以下是一个示例:

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title> 管理</title><link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/default/easyui.css"><link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/icon.css"><script type="text/javascript" src="https://www.jeasyui.com/easyui/jquery.min.js"></script><script type="text/javascript" src="https://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
</head>
<body><h2> 系数表管理</h2><p>通过此界面可以对 系数表进行增删改查操作。</p><table id="dg" title=" 系数表" class="easyui-datagrid" style="width:100%;height:500px"url="http://localhost:8080/coefficients"toolbar="#toolbar" pagination="true"rownumbers="true" fitColumns="true" singleSelect="true"><thead><tr><th field="id" width="50">ID</th><th field="dataMonth" width="100">月份</th><th field="clearingCoefficient" width="150"> 系数</th> <th field="createBy" width="100">创建者</th><th field="createTime" width="150">创建时间</th><th field="updateBy" width="100">更新者</th><th field="updateTime" width="150">更新时间</th></tr></thead></table><div id="toolbar"><a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newCoefficient()">新增</a><a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editCoefficient()">编辑</a><a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="destroyCoefficient()">删除</a></div><script type="text/javascript">$(function() {$('#dg').datagrid({onBeforeLoad: function(param) {param.page = param.page || 1; // 当前页码param.rows = param.rows || 10; // 每页记录数},loadFilter: function(data) {if (data && data.body) {var pageData = data.body;return {total: pageData.totalElements,rows: pageData.content};} else {return {total: 0,rows: []};}}});});function newCoefficient(){// 新增操作}function editCoefficient(){// 编辑操作}function destroyCoefficient(){// 删除操作}</script>
</body>
</html>
关键点解释
  1. onBeforeLoad: 在数据加载之前,设置请求参数 ​​page​​ 和 ​​rows​​,分别表示当前页码和每页记录数。
  2. loadFilter: 解析后端返回的数据,提取 ​​totalElements​​ 和 ​​content​​,分别表示总记录数和当前页的数据。

通过这种方式,你可以将 Spring Boot 返回的分页数据正确地展示在 EasyUI 数据网格中。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/46461.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【python学习】爬虫中常使用的urllib和requests库的的背景、定义、特点、功能、代码示例以及两者的区别

引言 urllib是Python标准库中的一个模块&#xff0c;它提供了一系列用于操作URL的功能 requests是一个Python第三方库&#xff0c;由Kenneth Reitz创建&#xff0c;用于简化HTTP客户端的编程 一、urllib的定义 urllib可以操作url&#xff0c;主要分为以下几个子模块&#xff1…

从人工巡检到智能防控:智慧油气田安全生产的新视角

一、背景需求 随着科技的飞速发展&#xff0c;视频监控技术已成为各行各业保障安全生产、提升管理效率的重要手段。特别是在油气田这一特殊领域&#xff0c;由于其工作环境复杂、安全风险高&#xff0c;传统的监控方式已难以满足实际需求。因此&#xff0c;基于视频监控AI智能…

侧开知识点合集2

一、try .... catch.. AccessViolationException异常触发后&#xff0c;下列程序的输出结果为 static void Main(string[] args) { try { throw new AccessViolationException(); Console.WriteLine("error1"); } catch (Exception e) { Console.WriteLi…

ROS2从入门到精通2-3:机器人3D物理仿真Gazebo与案例分析

目录 0 专栏介绍1 什么是Gazebo&#xff1f;2 Gazebo架构2.1 Gazebo前后端2.2 Gazebo文件格式2.3 Gazebo环境变量 3 Gazebo安装与基本界面4 搭建自己的地图4.1 编辑地图4.2 保存地图4.3 加载地图 5 常见问题 0 专栏介绍 本专栏旨在通过对ROS2的系统学习&#xff0c;掌握ROS2底…

CSS技巧专栏:一日一例 8 - 纯CSS利用mask属性实现按钮边框对称包围特效

CSS技巧专栏:一日一例 8 - 纯CSS利用mask属性实现按钮边框对称包围特效 上篇作业解题 在前一篇文章的最后,给各位看官留了一个作业,如上图所示。本篇文章,我们来公布一下它的源码。 主要实现的思路 四个渐变色的线段,沿着四个方向的依次运动,(运动在加载前执行)使用 …

均值滤波算法及实现

均值滤波器的使用场景&#xff1a; 均值滤波器使用于处理一些如上述蓝色线的高斯噪声场景 红色曲线是经过均值滤波处理后的数据。主要因为均值滤波设置数据缓冲区&#xff08;也即延时周期&#xff09;&#xff0c;使得测量值经过缓冲不会出现特别大的变化。 黄色曲线为高斯噪声…

【iOS】—— 消息传递和消息转发

【iOS】—— 消息传递和消息转发 1. 消息传递SEL选择子IMP快速查找汇编代码查找过程总结消息转送快速查找IMP 慢速查找总结消息传递慢速查找IMP 2. 消息转发动态决议动态解析添加方法 快速转发慢速转发 总结动态决议消息转发消息的三次拯救 1. 消息传递 在iOS中&#xff0c;消…

一、单例模式

文章目录 1 基本介绍2 实现方式2.1 饿汉式2.1.1 代码2.1.2 特性 2.2 懒汉式 ( 线程不安全 )2.2.1 代码2.2.2 特性 2.3 懒汉式 ( 线程安全 )2.3.1 代码2.3.2 特性 2.4 双重检查2.4.1 代码2.4.2 特性 2.5 静态内部类2.5.1 代码2.5.2 特性 2.6 枚举2.6.1 代码2.6.2 特性 3 实现的要…

【乐吾乐2D可视化组态编辑器】快捷键

快捷键 乐吾乐2D可视化组态编辑器demo&#xff1a;https://2d.le5le.com/ 快捷键描述空格 鼠标拖拽移动画布鼠标右键拖拽移动画布Ctrl 滚轮缩放画布Ctrl 点击 Pen多选Ctrl A全选Ctrl C复制Ctrl X剪切Ctrl V粘贴&#xff0c;alt视图中心粘贴&#xff0c;shift原位粘贴…

查询优化 -- UNION 用法

union 不返回重复行&#xff08;所有字段值相同的行&#xff09; union all 返回所有行 // 每类最多统计100条 select server_id,count(1) as logs from ( SELECT server_id FROM log WHERE log.type "a" AND server_id1 limit 100 ) UNION select server_id,coun…

谷粒商城-全文检索-ElasticSearch

1.简介 一个分布式的开源搜索和分析引擎,可以 秒 级的从海量数据中检索 主要功能:做数据的检索和分析(MySQL专攻于数据的持久化存储与管理CRUD达到百万以上的数据MSQL就会很慢,海量数据的检索和分析还是要用ElasticSearch) 用途:我们电商项目里的所有的检索功能都是由Elasti…

Java中为什么不能直接创建泛型数组

在Java中&#xff0c;不能直接创建泛型数组的主要原因是类型擦除和类型安全问题。 类型擦除 Java中的泛型是通过类型擦除&#xff08;Type Erasure&#xff09;实现的&#xff0c;这意味着在编译时&#xff0c;泛型类型会被转换成原始类型&#xff08;如 List<T> 会被转…

网络安全-网络安全及其防护措施9

41.网络故障排除 网络故障排除的定义和重要性 网络故障排除是指通过系统化的方法和工具&#xff0c;识别、诊断和解决网络中出现的问题&#xff0c;以恢复正常的网络服务和性能。有效的故障排除可以减少停机时间&#xff0c;提升网络的稳定性和可靠性。 故障排除的步骤 问题…

基于X86+FPGA+AI数字化医疗设备:全自动尿沉渣检测仪

助力数字医疗发展&#xff0c;信迈可提供全自动尿沉渣检测仪专用计算机 随着信息技术的不断进步&#xff0c;医疗也进入了一个全新的数字化时代。首先是医疗设备的数字化&#xff0c;大大丰富了医疗信息的内涵和容量&#xff0c;具有广阔的市场发展前景。 数字化医疗设备&…

使用Redis的SETNX命令实现分布式锁

什么是分布式锁 分布式锁是一种用于在分布式系统中控制多个节点对共享资源进行访问的机制。在分布式系统中&#xff0c;由于多个节点可能同时访问和修改同一个资源&#xff0c;因此需要一种方法来确保在任意时刻只有一个节点能够对资源进行操作&#xff0c;以避免数据不一致或…

白骑士的C++教学高级篇 3.1 文件操作

系列目录 上一篇&#xff1a;白骑士的C教学进阶篇 2.4 标准模板库&#xff08;STL&#xff09; 文件操作是C编程中的一个重要部分&#xff0c;允许程序与外部存储设备进行交互&#xff0c;从而实现数据的持久化存储和读取。C标准库提供了丰富的文件操作功能&#xff0c;包括文…

嵌入式香橙派人工智能AI开发板详细操作与远程聊天实现

大家好&#xff0c;今天给大分享一个OrangePi AIpro&#xff08;20T&#xff09;采用昇腾作为主控芯片的开发板&#xff0c;开箱以及对应功能的详细实现。 第一&#xff1a;板子基本介绍 接通电源给对应的开发板上电&#xff0c;观察其中的现象&#xff0c;如下&#xff1a; 注…

基于HAL库的stm32的OLED显示屏显示(IIC)

OLED OLED&#xff0c;即有机发光二极管( Organic Light Emitting Diode )。OLED由于同时具备自发光&#xff0c;不需背光源、对比度高、厚度薄、视角广、反应速度快、可用于挠曲性面板、使用温度范围广、构造及制程较简单等优异之特性&#xff0c;被认为是下一代的平面显示器…

龙国专利局瑞数6

声明(lianxi a15018601872) 本文章中所有内容仅供学习交流使用&#xff0c;不用于其他任何目的&#xff0c;抓包内容、敏感网址、数据接口等均已做脱敏处理&#xff0c;严禁用于商业用途和非法用途&#xff0c;否则由此产生的一切后果均与作者无关&#xff01; 前言(lianxi a…

富文本中提取信息并去除其中的HTML或XML标签

要从富文本中提取信息并去除其中的HTML或XML标签&#xff0c;可以使用不同的编程语言和库。以下是一些流行语言中的示例方法&#xff1a; 1. Python&#xff08;使用BeautifulSoup&#xff09; BeautifulSoup是一个强大的Python库&#xff0c;用于从HTML或XML文件中提取数据。…