牛客社区帖子分页显示实现

news2024/12/24 10:29:18

下图是前端分页的组件:
在这里插入图片描述

下面是对应的静态html页面,每一个方块,都是一个a标签,可以点击,执行的链接是/community/index,GET请求,拼接的参数是current,也就是pageNum,只需传入一个pageNum即可,因为pageSize已经固定死了,是10。
在这里插入图片描述
上面的html静态页面,是Thymeleaf结合后端传过来的Model动态生成的,下面View,Model+View可以渲染出一个静态的html页面。

  1. 首页、上一页、下一页、末页对应的a标签路径是固定的
  2. 中间1 2 3 …是一个循环显示的,从 page.from 循环到 page.to,在服务器后端会解析成page.getFrom(), page.getTo()。
  3. disable表示上一页或下一页点不了,因为当前页已经是开始或结束页。
  4. active表示某一个页数被点击,正处于某个页数上。
    在这里插入图片描述
    下面是服务器端的代码,处理index请求,这里Model和Page的对象都是spring帮我创建的,如果GET请求中有参数符合page中某个属性同名,就会用setXXX方法设置对象的成员变量值,否则就是默认的初始值,但page肯定是不为空的。
@RequestMapping(path = "/index", method = RequestMethod.GET)
    public String getIndexPage(Model model, Page page,
                               @RequestParam(name = "orderMode", defaultValue = "0") int orderMode) {
        // 方法调用钱,SpringMVC会自动实例化Model和Page,并将Page注入Model.
        // 所以,在thymeleaf中可以直接访问Page对象中的数据.
        page.setRows(discussPostService.findDiscussPostRows(0));
        page.setPath("/index?orderMode=" + orderMode);

        List<DiscussPost> list = discussPostService
                .findDiscussPosts(0, page.getOffset(), page.getLimit(), orderMode);
        List<Map<String, Object>> discussPosts = new ArrayList<>();
        if (list != null) {
            for (DiscussPost post : list) {
                Map<String, Object> map = new HashMap<>();
                map.put("post", post);
                User user = userService.findUserById(post.getUserId());
                map.put("user", user);

                long likeCount = likeService.findEntityLikeCount(ENTITY_TYPE_POST, post.getId());
                map.put("likeCount", likeCount);

                discussPosts.add(map);
            }
        }
        model.addAttribute("discussPosts", discussPosts);
        model.addAttribute("orderMode", orderMode);

        return "/index";
    }

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

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

相关文章

云服务器搭建XSS-platform、DVWA靶机和Permeate论坛

目录 前言准备环境安装步骤一、 部署MySQL二、 系统部署三、系统安装主页介绍 前言 我发现目前网上的xss-platform的搭建教程都是基于本地搭建的&#xff0c;这样搭建好的xss平台只能在本地使用&#xff0c;无法测试别的网站。而网络上的大部分xss平台又几乎都是收费的&#x…

网工内推 | 云计算运维,厂商云相关认证优先,股票期权,全勤奖

01 国科科技 招聘岗位&#xff1a;云计算运维 职责描述&#xff1a; 1、负责私有云平台的运维管理工作,包括云平台日常运维、故障处理、扩容、版本升级、优化和维护等。 2、根据业务需求,从技术角度支持及配合各业务系统上云工作。 3、为云上业务系统提供云产品、云服务方面的…

vue3项目手写记录(持续更新中)

安装pnpm 1)npm install -g pnpm 安装到全局, 2)pnpm create vue创建项目,不要在根级别c盘路径下创建项目.生成的这个项目,不要直接在根路径下,根路径内的文件夹下创建. 3)pnpm dev 运行项目 pnpm install 安装包node_modules. 配置eslient和pretteir 在.eslintrc.cjs文…

WS-BAN模型(细粒度图像分类)

WS-BAN模型&#xff08;细粒度图像分类&#xff09; 摘要Abstract1. WS-BAN1.1 文献摘要1.2 背景1.3 创新点1.4 WS-BAN方法1.4.1 弱监督注意学习1.4.2 注意力丢弃 1.5 实验1.5.1 数据集1.5.2 实施细节1.5.3 对比试验结果 2. Transformer代码学习3. 细粒度图像分类代码复现 摘要…

商店数据(八)

目录 57.后台权限表 58.推荐记录表 ​59.系统上传资源表 ​60.角色表 ​61.订单结算表 62.店铺表 63.店铺认证表 64.店铺申请&#xff08;移动端&#xff09;表 57.后台权限表 CREATE TABLE wat_privilgeid (privilegeod int(11) NOT NULL AUTO_INCREMENT COMMENT 自增…

时间序列模型(含python程序实现)

常用按时间顺序排列的一组随机变量来表示一个随机事件的时间序列&#xff0c;简记为 用表示该随机序列的n个有序观察值&#xff0c;称之为序列长度为n的观察值序列。 常用的时间序列模型 时间序列的预处理 拿到一个观察值序列后&#xff0c;首先要对它的纯随机性和平稳性进行…

分享开放原子AtomGit开源协作平台评测报告

AtomGit平台的总体介绍 开放原子开源基金会是致力于推动全球开源事业发展的非营利机构&#xff0c;于 2020 年 6 月在北京成立&#xff0c;由阿里巴巴、百度、华为、浪潮、360、腾讯、招商银行等多家龙头科技企业联合发起。目前有三个主要机构设置&#xff0c;技术监督委员会&…

09_Scala函数和对象

文章目录 函数和对象1.函数也是对象 scala中声明了一个函数 等价于声明一个函数对象2.将函数当作对象来用&#xff0c;也就是访问函数&#xff0c;但是不执行函数结果3.对象拥有数据类型(函数类型)&#xff0c;对象可以进行赋值操作4.函数对象类型的省略写法&#xff0c;也就是…

2024Xtu程设第一次练习题解

程设练习题谢大会专门查重 1.1531奇怪的数字 题目让我们从小到大输出1e6以内所有的答案&#xff0c;其实也没什么好的思路 就是将一个数n的所有位都拆出来&#xff0c;遍历这些位&#xff08;每次取一个x&#xff09;&#xff0c;然后通过作除法&#xff08;y n / x&#xf…

挤压激励注意力 SE | Squeeze-and-Excitation Networks

论文名称&#xff1a;《Squeeze-and-Excitation Networks》 论文地址&#xff1a;https://arxiv.org/pdf/1709.01507.pdf 代码地址&#xff1a; https://github.com/hujie-frank/SENet 卷积神经网络 (CNN) 的核心构建块是卷积运算符&#xff0c;它使网络能够通过在每一层的局…

杰发科技AC7840——CAN通信简介(6)_监听模式

参考&#xff1a;http://t.csdnimg.cn/AFFPC 0. 简介 7840支持4种扩展模式&#xff0c;其中监听模式。 监听模式概念 作用: 这里写的用于诊断&#xff0c;实际上我还没有用到&#xff0c;不太理解为啥可以用作诊断。 我的理解是&#xff0c;在多个总线下&#xff0c;使用监听…

Bug记录:AttributeError: module ‘numpy‘ has no attribute ‘object‘

使用Tensorflow进行模型训练时&#xff0c;之前都好用的&#xff0c;突然报错&#xff1a;AttributeError: module numpy has no attribute object。 问题原因&#xff1a;Numpy版本不兼容&#xff0c;我之前是1.24.4&#xff0c;后来又重装了好几个版本都不太行。 最终解决方…

verilog 从入门到看得懂---matlab 自动生成verilog

matlab 的强大不用多说&#xff0c;以前经常用simulink 生成c&#xff0c;最近尝试用simulink进行了verilog的生成&#xff0c;方法也很简单。 一个简单的示例如下。 1&#xff0c;新建一个模型文件&#xff0c;并且根据需要进行模型搭建 2.配置HDL生成模块 3.点击 generation…

基于Springboot的玩具租赁系统(有报告)。Javaee项目,springboot项目。

演示视频&#xff1a; 基于Springboot的玩具租赁系统&#xff08;有报告&#xff09;。Javaee项目&#xff0c;springboot项目。 项目介绍&#xff1a; 采用M&#xff08;model&#xff09;V&#xff08;view&#xff09;C&#xff08;controller&#xff09;三层体系结构&…

系统服务(22年国赛)—— DHCPDHCP Relay(中继)

前言&#xff1a;原文在我的博客网站中&#xff0c;持续更新数通、系统方面的知识&#xff0c;欢迎来访&#xff01; 系统服务&#xff08;22年国赛&#xff09;—— DHCP&&DHCP Relay(中继)https://myweb.myskillstree.cn/94.html 目录 一、题目 DHCP AppSrv 二…

【Burpsuite靶场】XSS专题精讲

【个人】&#xff1a;NEUQ大一学生 【专业】&#xff1a;通信工程 (Communication Engineering) 【个人方向】&#xff1a;网安、开发双管齐下 【座右铭】&#xff1a;真正的英雄主义,就是看清生活的真相后依然热爱生活 -- 罗曼.罗兰 一、认识XSS&#xff08;跨站脚本攻击&…

4.28总结

根据项目要求进行在线状态功能的实现&#xff08;还未真正实现&#xff0c;仅在数据库进行修改状态并与服务器断开连接&#xff09; 在登录界面时 此时服务器等待连接 连接成功后数据库里的在线状态进行更改 我设置了两种方式来进行改变状态 一&#xff1a; 通过不退出界面进…

基础动态规划 - 过河卒

过河卒 兵从A点走到B点的所有路径方案&#xff0c;且不能经过 “马能吃棋子”的格子。 如果没有马&#xff0c;那么这道题就是一个简单的从A点走到B点的所有路径情况的简单动态规划。 状态转移方程为 dp[i,j] dp[i - 1,j] dp[i,j - 1]。 但如果加上了马这个棋子&#xff0…

Day 21 LAMP架构和DNS域名

LAMP架构简介 针对不同的后端开发语言&#xff0c;使用不同的架构&#xff0c;后端项目开发语言有&#xff1a;Java&#xff0c;PHP&#xff0c;Python...... 针对于PHP项目 LAMP架构 LinuxApacheMysql/MariadbPhp LNMP架构 LinuxNginxMysql/MariadbPhp 针对于Java项目 w…

windows电脑改造为linux

有个大学用的旧笔记本电脑没啥用了&#xff0c;决定把它改成linux搭一个服务器&#xff1b; 一、linux安装盘制作 首先要有一个大于8G的U盘&#xff0c;然后去下载需要的linux系统镜像&#xff0c;我下的是ubuntu&#xff0c;这里自选版本 https://cn.ubuntu.com/download/d…