zoukankan      html  css  js  c++  java
  • element ui分页器的使用

        <el-pagination
            layout="total, prev, pager, next, jumper"
            :current-page="pageInfo.page"
            @current-change="onPageChange"
            :total="totalElementsData">
          </el-pagination>
    

    current-page表示的是当前的页数,就传data里面定义的就好,total表示的是总页数,current-change表示的是分页时候的事件

          pageInfo: {
              page: 1,
              size: 10,
          },
         totalElementsData:0,
    
        onPageChange (page) {
            this.pageInfo.page = page
            this.fetchData()   
         },
    
    fetchData (data = {}) {
             this.listLoading = true
             setTimeout(() => {
                this.listLoading = false
             }, 20000)
             this.criteria.page = this.pageInfo.page
             this.criteria.size = this.pageInfo.size
             var { name,contact, createStart,createEnd, checkStart,checkEnd, status ,page, size} = this.criteria
             var params ={ name, contact, createStart, createEnd, checkStart, checkEnd, status,page, size}
             fetchBusiness.cashManageData(params).then(res => {
              this.loading = false
              if (res.status === 200) {
                this.listLoading = false
                this.getCashList = res.data.data.content
                this.totalElementsData = +res.data.data.totalElements   //这里获取totalElementsData数据
              } else {
                this.$message({
                  message: res.data.message,
                  duration: 3000
                })
              }
            })       
         },
    
  • 相关阅读:
    07 面向对象
    06 二维数组
    05 数组
    04 循环控制语句
    03控制流程语句
    Mybatis-plus
    Solr全文检索服务器
    剑指offer-序列化和反序列化二叉树-树-python
    剑指offer-顺序打印二叉树节点(系列)-树-python
    剑指offer-对称二叉树-树-python
  • 原文地址:https://www.cnblogs.com/antyhouse/p/10046128.html
Copyright © 2011-2022 走看看