layui之分頁元件和評分元件

2022-05-13 13:50:45 字數 1590 閱讀 9218

1)基本使用

laypage 致力於提供極致的分頁邏輯,既可輕鬆勝任非同步分頁,也可作為頁面重新整理式分頁。模組載入名稱:laypage

view code

2)主要引數

1.elem:指向存放分頁的容器,值可以是容器id、dom物件。如:1. elem: 'id' 注意:這裡不能加 # 號

2. elem: document.getelementbyid('id')

2.count:總條數。一般從資料庫獲取。

3.limit:每頁顯示的條數,laypage將會借助 count 和 limit 計算出分頁數。

4.limits:每頁條數的選擇項。如果 layout 引數開啟了 limit,則會出現每頁條數的select選擇框

5.curr:起始頁,一般用於重新整理型別的跳頁

//

開啟location.hash的記錄

laypage.render();

6.groups:連續出現頁面的個數

9.first:自定義「首頁」的內容,支援傳入普通文字和html

10.last:自定義「尾頁」的內容,支援傳入普通文字和html

11.自定義主題:theme,支援傳入:顏色值,或任意普通字元。

12.hash:開啟location.hash,並自定義 hash 值。如果開啟,在觸發分頁時,會自動對url追加

3)切換分頁的**

當分頁被切換時觸發,函式返回兩個引數:obj(當前分頁的所有選項值)、first(是否首次,一般用於初始載入的判斷)

laypage.render(

}});

1)基本使用

view code

2)基礎引數

1.elem:指向容器選擇器

2.length:評分元件中具體星星的個數

3.value:評分的初始值

4.theme:主題顏色,預設的元件顏色是#ffb800

5.half:設定元件是否可以選擇半星

6.text:是否選擇評分對應的內容

7.readonly:是否唯讀,即只用於展示而不可點

3)自定義文字**

通過 settext 函式,在元件初次渲染和點選後時產生**。我們預設文字以星級顯示,你可以根據自己設定的文本來替換我們的預設文字,如 「討厭」 「喜歡」 。若使用者選擇分數而沒有設定對應文字的情況下,系統會使用我們的預設文字

var ins1 =rate.render(;

this.span.text(arrs[value] || ( value + "星"));

}});

4)點選產生的**

通過 choose 實現函式,在元件被點選後觸發,**分數,使用者可根據分數來設定效果,比如出現彈出層

rate.render(

});

DRF之分頁元件

rest framework提供了分頁的支援。我們可以在配置檔案中設定全域性的分頁方式,如 rest framework 也可通過自定義pagination類,來為檢視新增不同分頁行為。在檢視中通過pagination class屬性來指明。class largeresultssetpaginati...

vue 星星評分元件

評分外掛程式在購物的應用中經常可以看得到,但是用著別人的總是沒有自己寫的順手,正好趁著這段時間做乙個移動端應用的時候寫了乙個基於vue的評分元件,功能沒有寫全 主體結構 scorelayer v show isshowscore click hidescorelayer event center b...

Django元件之 分頁器

django自帶分頁器 paginator 用起來非常方便。怕自己寫的出bug,可以使用現成的 批量匯入資料 booklist for i in range 100 book.objects.bulk create booklist 分頁器的使用 book list book.objects.all...