1. 程式人生 > >資料表分頁

資料表分頁

HTML  

                <el-pagination
                        @size-change="handlePageSizeClick"
                        @current-change="handleCurrentChange"
                        :current-page="currentPage"
                        :page-sizes="[5, 10, 15]"
                        :page-size="pageSize"
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="totalDataCount">
                </el-pagination>

JS

 /**
     * 分頁,當前頁碼改變第幾頁
     */
    function handleCurrentChange(val) {
        this.currentPage = parseInt(val);
        //    改變後更新資料表
        this.initBeaconsData();
       
    }

    /**
     * 每頁顯示多少條
     */
    function handlePageSizeClick(val) {
        this.pageSize = parseInt(val);
         //    改變後更新資料表
        this.initBeaconsData();
       
    }

data()

        data() {
            return {
                totalDataCount: 1,
                pageSize: 5,
                currentPage: 1,
                    }
                }