ThinkPHP6 自定义分页样式 快速配置

2024-06-07 17:08

本文主要是介绍ThinkPHP6 自定义分页样式 快速配置,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

  • 背景
    首先,毕竟是入职新公司不久,不好改动原有的功能;
    所以,鄙人的想法是指展示自己负责的页面效果,不与原有代码冲突即可
    如下,相对来说是快速配置的效果,欢迎指摘 …

配置步骤

①. 页面文件的配置

  • 引入 bootstrap 公用静态文件

建议可以下载到自己的框架中,以免后期人家服务器停止服务

    <link rel="stylesheet" href="http://apps.bdimg.com/libs/bootstrap/3.3.0/css/bootstrap.min.css"><script src="http://apps.bdimg.com/libs/bootstrap/3.3.0/js/bootstrap.min.js"></script>

②. PHP 代码简要处理

  • 核心的分页代码参考如下,稍有工作经验的基本都能看懂 :
			$this->pageSize = 2;$list = ExcelProcess::getProcessList($this->pageSize);$view = ['pageSize' => page_size($this->pageSize, $list->total()),'page' => $list->render(),'list' => $list,'empty' => empty_list(18),];return view('import', $view);

③. 目标 html 文件的配置

  • 哪个页面需要显示 分页效果,就在其中编写如下代码

div-pagination-mz 是为了后期样式优化而定义的一个类名

    <div class="div-pagination-mz">{$pageSize|raw}{$page|raw}</div>

④. 公用 css 代码优化一下样式:

此处,是为了后期的样式优化,可自行补充

.div-pagination-mz{margin-top: 5px;margin-left: 10px;
}
.div-pagination-mz .page_total {float: left;width: auto;margin-top: 20px;margin-right: 3px;
}
.div-pagination-mz .pagination span{font-weight: bold;
}
.div-pagination-mz .pagination .active span{background-color: #1b7e5a;border-color:#1b7e5a;
}

最终效果:

附录

  • 如果是新做的项目,建议参考下面的文章,进行样式的修改,鄙人认为layui 效果很不错的!

  • 参考文章:
    【ThinkPHP6.0完全开发手册-分页】
    【ThinkPHP6+Layui自定义分页样式】

这篇关于ThinkPHP6 自定义分页样式 快速配置的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1039781

相关文章

使用Python快速实现链接转word文档

《使用Python快速实现链接转word文档》这篇文章主要为大家详细介绍了如何使用Python快速实现链接转word文档功能,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 演示代码展示from newspaper import Articlefrom docx import

SpringBoot+MyBatis-Flex配置ProxySQL的实现步骤

《SpringBoot+MyBatis-Flex配置ProxySQL的实现步骤》本文主要介绍了SpringBoot+MyBatis-Flex配置ProxySQL的实现步骤,文中通过示例代码介绍的非常详... 目录 目标 步骤 1:确保 ProxySQL 和 mysql 主从同步已正确配置ProxySQL 的

Spring Boot整合log4j2日志配置的详细教程

《SpringBoot整合log4j2日志配置的详细教程》:本文主要介绍SpringBoot项目中整合Log4j2日志框架的步骤和配置,包括常用日志框架的比较、配置参数介绍、Log4j2配置详解... 目录前言一、常用日志框架二、配置参数介绍1. 日志级别2. 输出形式3. 日志格式3.1 PatternL

配置springboot项目动静分离打包分离lib方式

《配置springboot项目动静分离打包分离lib方式》本文介绍了如何将SpringBoot工程中的静态资源和配置文件分离出来,以减少jar包大小,方便修改配置文件,通过在jar包同级目录创建co... 目录前言1、分离配置文件原理2、pom文件配置3、使用package命令打包4、总结前言默认情况下,

一文教你使用Python实现本地分页

《一文教你使用Python实现本地分页》这篇文章主要为大家详细介绍了Python如何实现本地分页的算法,主要针对二级数据结构,文中的示例代码简洁易懂,有需要的小伙伴可以了解下... 在项目开发的过程中,遇到分页的第一页就展示大量的数据,导致前端列表加载展示的速度慢,所以需要在本地加入分页处理,把所有数据先放

Redis存储的列表分页和检索的实现方法

《Redis存储的列表分页和检索的实现方法》在Redis中,列表(List)是一种有序的数据结构,通常用于存储一系列元素,由于列表是有序的,可以通过索引来访问元素,因此可以很方便地实现分页和检索功能,... 目录一、Redis 列表的基本操作二、分页实现三、检索实现3.1 方法 1:客户端过滤3.2 方法

CSS自定义浏览器滚动条样式完整代码

《CSS自定义浏览器滚动条样式完整代码》:本文主要介绍了如何使用CSS自定义浏览器滚动条的样式,包括隐藏滚动条的角落、设置滚动条的基本样式、轨道样式和滑块样式,并提供了完整的CSS代码示例,通过这些技巧,你可以为你的网站添加个性化的滚动条样式,从而提升用户体验,详细内容请阅读本文,希望能对你有所帮助...

VScode连接远程Linux服务器环境配置图文教程

《VScode连接远程Linux服务器环境配置图文教程》:本文主要介绍如何安装和配置VSCode,包括安装步骤、环境配置(如汉化包、远程SSH连接)、语言包安装(如C/C++插件)等,文中给出了详... 目录一、安装vscode二、环境配置1.中文汉化包2.安装remote-ssh,用于远程连接2.1安装2

Redis多种内存淘汰策略及配置技巧分享

《Redis多种内存淘汰策略及配置技巧分享》本文介绍了Redis内存满时的淘汰机制,包括内存淘汰机制的概念,Redis提供的8种淘汰策略(如noeviction、volatile-lru等)及其适用场... 目录前言一、什么是 Redis 的内存淘汰机制?二、Redis 内存淘汰策略1. pythonnoe

windos server2022的配置故障转移服务的图文教程

《windosserver2022的配置故障转移服务的图文教程》本文主要介绍了windosserver2022的配置故障转移服务的图文教程,以确保服务和应用程序的连续性和可用性,文中通过图文介绍的非... 目录准备环境:步骤故障转移群集是 Windows Server 2022 中提供的一种功能,用于在多个