<div class="block1">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange" //页面变化时的函数
:current-page.sync="currentPage1" // 设置默认页,在data中为1
:page-size="7" // element 是根据page-size 和 total 来显示你有多少页码。如果不在此设置page-size,只在data中设置 pageSize不行的
layout="total,prev, pager, next"
:total="total">
</el-pagination>
</div>

如果不设置pageSize ,它只显示了8.我在data中设置了每页7条,总共才56 ,远达不到默认的总条数74。 所以    :pageSize    是必要的。 后面的分页则只需要传入pageNum了。

handleCurrentChange(val) {
console.log(`当前页: ${val}`);
const _this = this;
_this.getUrl(val) // 调取列表的函数,初始化时调一次。
},

elementUI 的el-pagination 分页功能的更多相关文章

  1. 在vue+elementUI项目中使用分页功能

    HTML: <div class="mRttt">         <!-- 分页 -->          <el-pagination       ...

  2. 项目中的一个分页功能pagination

    项目中的一个分页功能pagination <script> //总页数 ; ; //分页总数量 $(function () { // $("#pagination"). ...

  3. Django【进阶】分页功能Pagination

    项目中,我们需要很多非业务逻辑的功能,例如分页功能,而且此类功能移植性很好,可以在不同的项目中使用,所以整理好这些功能会一定程度上提高开发效率,下面是分页功能代码,使用时,可单独放在utils目录 & ...

  4. 应用五:Vue之ElementUI 表格Table与分页Pagination组件化

    (注:本文适用于有一定Vue基础或开发经验的读者,文章就知识点的讲解不一定全面,但却是开发过程中很实用的) 在平时的web项目开发过程中,列表分页查询展示应用的很频繁,为了便于阅读并减少代码的冗余,所 ...

  5. pagination实现分页功能

    pagination.js: /** * pagination分页插件 */ ;(function($,window,document,undefined){ //配置参数 var defaults ...

  6. 分页功能的实现——Jdbc && JSP

    @目录 什么是分页 ? 两个子模块功能的问题分析 和 解决方案 有条件查和无条件查询的影响 和 解决方案 项目案例: mysql + commons-dbutils+itcast-tools+Base ...

  7. 《JavaWeb从入门到改行》分页功能的实现

    @目录 什么是分页 ? 两个子模块功能的问题分析 和 解决方案 有条件查和无条件查询的影响 和 解决方案 项目案例: mysql + commons-dbutils+itcast-tools+Base ...

  8. 原生js实现分页功能

    原生就是实现分页功能 代码如下: var pagination = function(option,fun){ this.parentId = option.id; //容器 this.pageSiz ...

  9. 测试开发【提测平台】分享9-DBUntils优化数据连接&实现应用搜索和分页功能

    微信搜索[大奇测试开],关注这个坚持分享测试开发干货的家伙. 从本期开始知识点讲以思维导图的形式给出,内容点会按照讲解-应用-展示的形式体现,这样会更清晰些. DBUntils连接池 在项目中链接数据 ...

  10. 【jQuery 分页】jQuery分页功能的实现

    自写的jQuery实现分页功能的分页组件: 功能效果如下: 分页组件就是上图中的三部分, 分别放在表格上部  和下部 . 其中, 1>>>页面的代码如下: product.jsp 其 ...

随机推荐

  1. 使用phpexcel导入excel文件种的时期数据时数据导入格式

    在使用phpexcel导入类似于 YYYY-MM-DD HH:ii:ss格式的数据时,导入成功以后会发现导入的数据其实是类似于42085.746516204格式的数据( excel在存储时间类型的数据 ...

  2. NSQ消息队列

    前面的总结中提到过这个玩意,所以简单说说,win上面的测试验证 网上有比较合适的博文,我先推荐几篇 https://blog.csdn.net/a2247889821/article/details/ ...

  3. 分支结构case 语句举例

  4. windows server 进入组策略管理

    方法: win+R 然后输入   gpmc.msc 即可在域服务器上进行组策略管理了.

  5. Centos yum的源 设置为阿里云源

    在 阿里巴巴镜像站页面,在centos 操作的帮助,有介绍 wget和curl 2种方式来下载CentOS-Base.repo 备份 mv /etc/yum.repos.d/CentOS-Base.r ...

  6. Jquery中的offset()和position()深入剖析(元素定位)

    先看看这两个方法的定义. offset(): 获取匹配元素在当前视口的相对偏移. 返回的对象包含两个整形属性:top 和 left.此方法只对可见元素有效. position(): 获取匹配元素相对父 ...

  7. mysql添加中文数据失败

    日志信息: INFO 2015-01-13 10:44:36,078 org.springframework.beans.factory.xml.XmlBeanDefinitionReader: Lo ...

  8. Zip函数(Python)

    >>> z = zip((2,3,4),(33,44,55)) >>> z <zip object at 0x1022cdb88> >>&g ...

  9. 揭秘阿里云WAF背后神秘的AI智能防御体系

    背景 应用安全领域,各类攻击长久以来都危害着互联网上的应用,在web应用安全风险中,各类注入.跨站等攻击仍然占据着较前的位置.WAF(Web应用防火墙)正是为防御和阻断这类攻击而存在,也正是这些针对W ...

  10. Python--线程队列(queue)、multiprocessing模块(进程对列Queue、管道(pipe)、进程池)、协程

    队列(queue) 队列只在多线程里有意义,是一种线程安全的数据结构. get与put方法 ''' 创建一个“队列”对象 import queue q = queue.Queue(maxsize = ...