scroll-y(基於scroll-view二次開發的組件)
可豎向滾動的視圖區域,需要給scroll-y組件一個固定的高度。
屬性 | 類型 | 默認值 | 必填 | 說明 |
height | String | 0px | 是 | scroll-y組件的固定高度(內部scroll-view視圖容器的固定高度),可傳入px/rpx。例如:height = "100px" 或者 height = "100rpx" |
scroll-top | Number | 0 | 否 | 設置豎向滾動條位置 |
refresher-threshold | Number | 100 | 否 | 設置自定義下拉刷新閾值 |
refresher-background | String |
#f6f6f6 | 否 | 自定義下拉刷新區域背景色 |
refresher-triggered | Boolean | false | 否 | 下拉刷新狀態(false表示未下拉,true表示被下拉) |
pull-style | String | circle-progress | 否 | 下拉樣式,默認為circle-progress,可取值:circle-progress、diy(diy:自定義,提供 slot = "pull-animation") |
refresh-style | String | circle | 否 | 下拉后刷新樣式,默認值為circle,可取值:circle、clock、diy(diy:自定義,提供 slot = "refresh-animation") |
pull-tip | String | 下拉刷新 | 否 | 下拉過程中提示字 |
release-tip | String | 釋放刷新 | 否 | 下拉到可釋放位置,提示文字 |
refresh-tip | String | 正在刷新中 | 否 | 刷新中文字提示 |
tip-text-color | String | #b2b2b2 | 否 | pull-tip、release-tip、refresh-tip、load-tip 文字的顏色 |
load-more | Boolean | false | 否 | 是否開啟上拉加載。默認值為false,取值:false為不開啟,true為開啟 |
load-style | String | circle | 否 | 上拉加載動畫,默認為circle,可取circle、clock、diy(diy:自定義,提供 slot = "load-animation") |
load-tip | String | 正在加載中 | 否 | 上拉加載文字提示,默認字體色為#b2b2b2,字體大小為11px |
load-background | String | #f6f6f6 | 否 | 上拉加載背景色 |
bindrefresherpulling | eventhandle | 否 | 自定義下拉刷新控件被下拉 | |
bindrefresherrefresh | eventhandle | 否 | 自定義下拉刷新被觸發 | |
bindrefreshrestore | eventhandle | 否 | 自定義下拉刷新被復位 | |
bindrefresherabort | eventhandle | 否 | 自定義下拉刷新被終止 | |
bindloadmore | eventhandle | 否 | 上拉加載,通過 event.detail.current 可獲取當前頁 |
Tip:
1. 自定義動畫一定結合上面屬性去完成。
2. 刷新完成后,通過控制refresher-trigered屬性控制刷新結束。
3. 上拉加載是有節流效果,默認在2000ms觸發一次,可通過修改scroll-y.js中的源代碼修改執行時間。
組件鏈接:scroll-y組件