<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. A Bite Of React(1)

    react: component and views : produce html abd add them on a page( in the dom) <import React from ...

  2. how to prevent lowmemorykiller from killing processes

    Hi there, I've upgraded a number of test systems to the latest Saucy beta. I've seen quite a few cas ...

  3. Visual Studio Code如何编写运行C、C++

    Visual Studio Code如何编写运行C.C++ 作者:知乎用户链接:https://www.zhihu.com/question/30315894/answer/154979413来源:知 ...

  4. C#编程—第五天--循环语句for

    for穷举法.迭代法 穷举法练习: //穷举法: //1.找100以内的与7有关的数 //2.小明单位发了一百元的购物卡,他到超市买洗化用品,一是洗发水(15元),二是香皂(2元),三是牙刷(5元)怎 ...

  5. javax.net.ssl.SSLKeyException: RSA premaster secret error

    环境jdk1.7, 调用第三方接口时,出现javax.net.ssl.SSLKeyException: RSA premaster secret error错误,解决方案,将jre/lib/ext所有 ...

  6. 【QT学习】数独游戏

    前几天刷leetcode刷到一题,讲sudokuSolver,写完感觉很有意思,遂想做一个数独游戏,百度了一下如何自动生成题库,参考某位大神安卓下的实现思路,自己做了一套文字版的数独游戏,后来想乘机会 ...

  7. win10 + VS2015 编译 ARPACK

    step 1: 下载ARPACK , mingw-w64-install 和 mingw-get-inst-20120426.exe: step 2: 安装 MinGW-64默认安装路径即可. ste ...

  8. postgres服务之加密

    数据中往往会出现一些敏感字段,例如电话,邮箱等,这时候有需求进行加密保存 目前可以实现的方式有两种 方式一:这种方法,aes的加密方法不支持aes-192,不支持aes-256 #使用encrypt加 ...

  9. proxy-target-class="false"与proxy-target-class="true"区别

    原创转载请注明出处:https://www.cnblogs.com/agilestyle/p/11484063.html <aop:aspectj-autoproxy proxy-target- ...

  10. Delphi 获取系统的语言环境参数GetSystemDefaultLangID、VerLanguageName、GetLocaleInfo

    1 核心的两个API函数:GetSystemDefaultLangID 和 VerLanguageName. GetSystemDefaultLangID:获得系统默认语言的ID VerLanguag ...