一,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