你好！ 這是你第一次使用markdown編輯器所展示的歡迎頁。如果你想學習如何使用markdown編輯器, 可以仔細閱讀這篇文章，了解一下markdown的基本語法知識。
"20"
>
"3">
<
!--導航選擇事件--
>
default
-active=
"activestep" @select=
"jump"
>
for=
"(item,index) in menudata"
:index=
"`$`"
:key=
"item.subjectid"
>
="el-icon-menu"
>
<
/i>
"title"
>
}<
/span>
<
/el-menu-item>
<
/el-menu>
<
/el-col>
<
!--繫結scroll事件需要監聽--
>
"21"
class
="scroll_cls" @scroll=
"onscroll"
>
for=
"(item,index) in tableobject"
:key=
"index" style=
"height:500px"
>
="title scroll-item"
:id=
"item.name"
>
}<
/div>
"item.rows"
:key=
"index"
>
"序號" type=
"index" width=
"50"
>
<
/el-table-column>
"channelid" label=
"渠道/團隊id"
>
<
/el-table-column>
"channelname" label=
"渠道/團隊"
>
<
/el-table-column>
"rulecode" label=
"分配方案id"
>
<
/el-table-column>
"rulename" label=
"分配方案名稱"
>
<
/el-table-column>
"ruleversion" label=
"版本號"
>
<
/el-table-column>
"hierarchy" label=
"級別"
>
"scope"
>
}<
/span>
<
/template>
<
/el-table-column>
"有效期"
>
"scope"
>
}<
/span>
<
/template>
<
/el-table-column>
"creatorname" label=
"操作人"
>
<
/el-table-column>
"createtime" label=
"操作時間"
>
<
/el-table-column>
"ordercnt" label=
"關聯訂單"
>
"scope"
>
@click=
"orderhandleclick(scope.row.ordercnt)"
type=
"text"
size=
"small"
>
}<
/el-button>
<
/template>
<
/el-table-column>
"操作"
>
"scope"
>
"settinghandleclick(scope.row)" type=
"text" size=
"small"
>設定分配方案<
/el-button>
<
/template>
<
/el-table-column>
<
/el-table>
v-if=
"item.total > 5"
style=
"margin-top: 15px"
size=
"small"
@size-change=
"handlesizechange($event,index)"
@current-change=
"handlecurrentchange($event,index)"
:current-page=
"ruleform.agenum"
:page-sizes=
"[10, 30, 50, 100]"
:page-size=
"ruleform.pagesize"
layout=
"total, sizes, prev, pager, next"
:total=
"item.total"
>
<
/el-pagination>
<
/div>
<
/el-col>
<
/el-row>
// 滾動觸發按鈕高亮
methods:}}
,jump
(index)
let total = scrollitems[index]
.offsettop - scrollitems[0]
.offsettop;
// 錨點元素距離其offsetparent(這裡是body)頂部的距離(待滾動的距離)
console.
log(total)
let distance = document.
queryselector
(".scroll_cls"
).scrolltop;
// 滾動條距離滾動區域頂部的距離
console.
log(distance)
// let distance = document.body.scrolltop || document.documentelement.scrolltop || window.pageyoffset // 滾動條距離滾動區域頂部的距離(滾動區域為視窗)
// 滾動動畫實現, 使用settimeout的遞迴實現平滑滾動，將距離細分為50小段，10ms滾動一次
// 計算每一小段的距離
let step = total /50;
if(total > distance)
else
// 引數element為滾動區域
function
smoothdown
(element)
else
}// 引數element為滾動區域
function
smoothup
(element)
else
} document.
queryselectorall
('.scroll-item').
foreach
((item, index1)
=>)}
})},
},mounted()
)},
.scroll_clsvue Element ui 實現分頁
實現分頁功能的關鍵技術點為頁面顯示的結果處理，而此處的關鍵技術點為js的slice 方法。首先介紹slice 方法 slice 方法可從已有的陣列中返回選定的元素。slice 方法可提取字串的某個部分，並以新的字串返回被提取的部分。主要用法 array.slice start,end 引數描述 st...
vue element ui 實現分頁效果
我使用得是el table el pagination來實現的，話不多說，直接上 編輯刪除 export default inject reload 注入reload方法 data created mounted methods handlecurrentchange function curren...
vue Element ui實現分頁效果
當我們向後台請求大量資料的時候，並要在頁面展示出來，請求的資料可能上百條資料或者更多的時候，並不想在乙個頁面展示，這就需要使用分頁功能來去完成了。1.本次所使用的是vue2.0 element ui實現乙個分頁功能，element ui這個元件特別豐富，分頁中給我提供了乙個pagination 分頁...