vue element分頁器元件封裝

分頁元件

<
!-- 分頁元件的封裝 --
>
="pagination"
>
@size-change=
"sizechange"
@current-change=
"currentchange"
:page-sizes=
"[1, 5, 10]"
layout=
"total, sizes, prev, pager, next, jumper"
:current-page.sync=
"pagenum"
:page-size=
"pagesize"
:total=
"total"
:small=
"small"
>
<
/el-pagination>
<
!-- layout=
"total, sizes, prev, pager, next, jumper"
-->
<
/div>
<
/template>
export
default;}
,//子元件接收父元件的值
props:
,    pagesize:
,    small:,}
,//計算屬性  計算屬性是基於他們的依賴做快取
// （如果計算的邏輯大的話，可以用這個，比方說你先迴圈100次，再迴圈1000次，他會把上一次的迴圈也加上去，也就是快取）
computed:
,//偵聽器 響應資料的變化
watch:},
},methods:
,// size變化
currentchange
(val),}
,};<
/script>
"scss" scoped>
.pagination 
<
/style>

"this.total"

class
="totalclass"
>
:pagenum=
"this.form.page"
:total=
"this.total"
:pagesize=
"this.form.size"
:small=
"true"
@sizechange=
"sizechange"
@currentchange=
"currentchange"
>
<
/paging>
<
/div>

import paging from

"@/components/public/paging.vue"
;data()
,}}

currentchange

(val)

,//每頁顯示幾條資料按鈕

sizechange

(val)

,//調取介面

gettable()

).then

((res)

=>});},

vue element分頁元件封裝成公共元件

1.首先定義乙個分頁子元件 background background current page.sync currentpage 第幾頁 page size.sync pagesize 每頁顯示幾條資料 layout layout page sizes pagesizes 可選的每頁多少條資料 t...

分頁器元件

在頁面顯示分頁資料，需要用到django分頁器元件 from django.core.paginator import paginator paginator物件 paginator paginator user list,10 per page 每頁顯示條目數量 count 資料總個數 num p...

分頁器元件

這是乙個完善的python後端分頁器 能解決使用者百分之八十的web應用分頁實現 class pagination object def init self,current page,all count,per page num 2,pager count 11 封裝分頁相關資料 param cur...