この記事では主に、LayUIに基づいたフロントエンドページング機能を実装する方法を紹介します。編集者はこれがとても良いものだと思ったので、皆さんの参考として今から共有します。編集者をフォローして見てみましょう。皆さんのお役に立てれば幸いです。
1. LayUIの紹介
Layuiは独自のモジュール仕様で書かれた国産のフロントエンドUIフレームワークであり、ネイティブHTML/CSS/JSの記述形式を踏襲しており、敷居が非常に低いです。箱の。いくつかの共通の要素とコンポーネントを備えた組み込みの UI フレームワーク。
ダウンロード後、プロジェクトに導入してください。
2. LayPage パラメーターの概要
laypage は、ページング時に直接呼び出すことができる組み込みのカプセル化されたオブジェクトです。ここには主に次のパラメーターがあり、laypage のキーと値のペアのセットを構成するために使用されます。
キー |
デフォルト値 |
タイプ |
説明 |
続き |
必須d |
文字列/オブジェクト |
コンテナ。値は要素 ID またはネイティブ DOM または jquery オブジェクトで渡すことができます |
pages |
Required |
Number |
ページ数 |
curr |
1 |
番号 |
現在のページ。 |
groups |
5 |
Number |
連続するページの数。 |
skin |
default |
String |
コントロールページネーションスキン |
first |
1 |
数値/文字列/ブール |
使用ホームページを制御するため。 first: false、ホームページ項目を表示しないことを意味します |
last |
ページの合計値 |
Number/String/Boolean |
は、最後のページを制御するために使用されます。 last: false、最後のページ項目 |
prev |
previous page |
String/Boolean |
が前のページを制御するために使用されることを意味します。表示されない場合は |
next |
Next page |
String/Boolean |
をfalseに設定して次のページを制御します。表示されない場合は、 false を設定してください。 |
jump |
コアパラメータ |
Function |
は、ページング後にコールバックをトリガーし、関数は2つのパラメータを返します。 |
3. ページングの実装
フロントエンドにページを表示します。コードは次のとおりです:
ページネーションの効果は次のとおりです:
フロントエンドページングに関する10のおすすめ記事
以上がLayUIはフロントエンドページング機能を実装しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。