我在vue+element ui中 Pagination分页 中我的代码无效呢？

Question

我在vue+element ui中 Pagination分页 中我的代码无效呢？附上我的代码    {{totalone}}       <el-pagination          @size-change="handleSizeChange"          @current-change="handleCurrentChange"          :current-page="currentPage4"           :page-sizes="[5, 10, 20, 30]"           :page-size="5"　　　　　　:total="totalone"> 　　　　</el-pagination>　　　　{{totalone}}是我的总数据我的页面效果是这样的我想每5条是一页，但是我的没有效果在线等，请问是为什么呢？

Answer 1

是这个吗？

:current-page="currentPage"

Answer 2

pagination 只是分页选择器 ，，，数据的展示多少需要在请求的时候，或者自己生成的时候去限制，而不是说你用el-pagination 就会给你把你的数据处理掉

Answer 3

element ui的分页并不能帮你把数据切分，你需要手动处理你的数据

就是：比如你的总数据是listData,你可以在data里加一个pageData,这个用作页面数据展示

pageData = listData.slice(当前页每页个数,(当前页每页个数)*每页个数)

在你的handleSizeChange及handleCurrentChange函数里，都要触发一次这个代码

Answer 4

列表页：

分页组件：

  <page :page-data="pageData" v-on:pageEvent="pageChange" ></page>

 //分页操作

            pageChange(data) {

                this.getList(data.pageSize，data.currentPage);

            },

分页页面：

 //改变每页显示条数size

            handleSizeChange(val) {

                let curData = this.pageData

                curData.pageSize = val

                this.$emit('pageEvent',curData)

            },

            //当前页数

            handleCurrentPageChange(val) {

                let curData = this.pageData

                curData.currentPage = val

                this.$emit('pageEvent',curData)

            }