vue element ui 靜態資料分頁聯動

2021-10-01 22:41:11 字數 2587 閱讀 2702

頁面最後展示部分

"6">批量通過<

/el-button>

"danger" disabled :span=

"6">批量不通過<

/el-button>

<

/el-row>

:data=

"tabledata.slice((currentpage-1)*pagesize,currentpage*pagesize)"

border

style=

"width: 100%"

>

type=

"selection"

width=

"55"

>

<

/el-table-column>

fixed

prop=

"date"

label=

"日期"

min-width=

"150"

>

<

/el-table-column>

prop=

"name"

label=

"姓名"

min-width=

"120"

>

<

/el-table-column>

prop=

"province"

label=

"省份"

min-width=

"120"

>

<

/el-table-column>

prop=

"city"

label=

"市區"

min-width=

"120"

>

<

/el-table-column>

prop=

"address"

label=

"位址"

min-width=

"300"

>

<

/el-table-column>

prop=

"zip"

label=

"郵編"

min-width=

"120"

>

<

/el-table-column>

fixed=

"right"

label=

"操作"

min-width=

"100"

>

"scope"

>

"handleclick(scope.row)" type=

"text" size=

"small"

>通過<

/el-button>

"text" size=

"small"

>不通過<

/el-button>

<

/template>

<

/el-table-column>

<

/el-table>

"24"

>

"handlesizechange" @current-change=

"handlecurrentchange"

:current-page=

"1":page-sizes=

"[5, 10]"

:page-size=

"10" layout=

"total, sizes, prev, pager, next, jumper"

:total=

"tabledata.length"

>

<

/el-pagination>

<

/el-col>

<

/el-row>

<

/div>

<

/template>

export

default

,handlesizechange

(val)條`)

;this

.pagesize = val;},

handlecurrentchange

(val)`)

;this

.currentpage = val;}}

,data()

,,,,

,,,,

,,,,

],pagetotal:0,

currentpage:1,

//預設第一頁

pagesize:

10//當前顯示頁數}}

}

vue elementUI專案搭建

安裝node 基於node之npm環境下操作vue,所以先部署node 安裝gitwget http 7 extras x86 64 packages epel release 7 11.noarch.rpm yum install y epel release 7 11.noarch.rpm yu...

重置表單(vue elementui)

第一種 在methods下的具體方法中直接乙個乙個地將表單繫結的值賦值為空 最笨的方法,只適用於僅幾個繫結值的情況下 第二種 elementui官網的方法 從這裡直接進入官網表單相關位置 model ruleform rules rules ref ruleform label width 100p...

vue elementUi許可權管理

第一次摸索著完成vue的許可權管理,在此記錄下自己搬磚的點點滴滴,希望以後回望的時候,有跡可循,也分享給需要的小夥伴們,參考哦 思路如下 1,登入成功後,把後台返回的使用者資訊,存vuex的state 2,vuex的actions調介面,返回資料後,賦值給state,然後呼叫遞迴,來把返回的資料處理...