zoukankan      html  css  js  c++  java
  • element之分页

    一,HTML

    <el-pagination
                    @current-change="handleCurrentChange"
                    @size-change="handleSizeChange"
                    :page-size="pageSize"
                    background
                    layout="prev, pager, next"
                    :total="this.allpage"
                    :current-page.sync="currentPage"
                    >
    </el-pagination>

    二,script    

    <script>
        export default{
    
          name:'app',
          data(){
             pageSize:4,  //每页显示多少条
             allpage:'',
             currentPage:1 //页数
    
          },
          methods:{
              handleCurrentChange(val){
                   this.currentPage = val
               this.list(); //显示列表的接口
           },
           /**当前条数***/
         handleSizeChange(size){
                 this.pageSize = size;
                 this.list();
         },
             /**显示列表接口**/
        list(){
            let obj = this.qs.stringify({
                   page:this.currentPage,
                   count:this.pageSize
            })
            this.$axios.post('l接口名称', obj, res => {
                console.log(res);
            }, f => {
            console.log(f)
            }, e => {
            console.log(e)
            }) 
          }
    
        }
      }
    </script>

     图示:

        

                              

                                                                                                                                                                                                                  --------END

  • 相关阅读:
    阿里云的服务器内网互通的前提条件
    Java Map 接口
    ModelAndView学习笔记
    tomcat错误信息解决方案【严重:StandardServer.await: create[8005]】
    jquery获得select option的值 和对select option的操作
    【Git使用详解】Egit的常用操作详解
    iOS
    iOS
    iOS
    iOS
  • 原文地址:https://www.cnblogs.com/liujiajiablog/p/10373656.html
Copyright © 2011-2022 走看看