vue+Element-ui实现分页效果

 

  
    数据管理
   用户列表
  
  

     
       
      
       
      
       
      
       
      
       
       
     
       //这是显示总共有多少数据，
     
  
 

data () {
  return {
    currentPage:1, //初始页
    pagesize:10, // 每页的数据
    userList: []
  }
 },

created() {
  this.handleUserList()
 },
 methods: {
  // 初始页currentPage、初始每页数据数pagesize和数据data
  handleSizeChange: function (size) {
    this.pagesize = size;
    console.log(this.pagesize) //每页下拉显示数据
  },
  handleCurrentChange: function(currentPage){
    this.currentPage = currentPage;
    console.log(this.currentPage) //点击第几页
  },
  handleUserList() {
   this.$http.get('http://localhost:3000/userList').then(res => { //这是从本地请求的数据接口，
    this.userList = res.body
   })
  }
 }