レイウイのページングの使い方

爱喝马黛茶的安东尼
リリース: 2019-07-11 09:45:16
オリジナル
7756 人が閲覧しました

layui は非常に実用的なフロントエンド開発ライブラリです。これを使用すると、さまざまな美しいフロントエンド UI を簡単かつ簡単に作成できます。一般的に使用されるページング コンポーネントと、layui を使用してそれを完成させる方法を簡単に見てみましょう。ほんの数行のコードで十分です。

レイウイのページングの使い方

#メソッド/ステップ

まず、lay に対応するスクリプト ファイルとスタイル ファイルを導入する必要があります。


レイウイのページングの使い方

HTML では、空の div を作成してページング コンポーネントを生成し、この div に ID を指定するだけです。

レイウイのページングの使い方

js スクリプト コードでは、最初にレイページ ページング コンポーネント インスタンス オブジェクトを生成します。

レイウイのページングの使い方

#次に、このオブジェクトの render メソッドを呼び出して、ページングの各要素をレンダリングします。

render メソッドでは、オブジェクトを渡します。elem は div の ID です。

count は、ページング オブジェクト内にデータがいくつあるかを示すために使用されます。

レイウイのページングの使い方

このコードを実行すると、レンダリングされたページングが表示されます。非常に単純なコードで、美しいページングを取得できます。

レイウイのページングの使い方

関連する推奨事項: 「

layui フレームワーク チュートリアル

上記のデータから、デフォルトでは 1 ページであることがわかります。データは10個。

もちろん、これを構成することもできます。ここでは、limit パラメーターを指定するだけで、4 に設定します。

レイウイのページングの使い方

ページを更新すると、1 ページあたり 20 個のデータと 4 行のデータがあり、5 ページに分割されていることがわかります。

レイウイのページングの使い方

#ページング コントロールでは、非常に重要な機能はインタラクションの必要性です。つまり、特定のページをクリックした後、対応するページのデータを表示する必要があります。表示されます。

したがって、コンポーネントは対話用のジャンプ メソッドを提供します。このメソッドでは、パラメーター obj が渡されます。この obj から、現在のデータを取得する obj.cur などの一般的に使用されるデータを取得できます。ページ番号。

obj.limit は各ページに含まれるデータの数を取得できます。

レイウイのページングの使い方

レイウイのページングの使い方

以上がレイウイのページングの使い方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート