Laravelのスクロール時にAjaxページネーションを使用してより多くのデータをロードする方法の例

このチュートリアルでは、Laravel 11 アプリケーションで AJAX ページネーションを使用した無限スクロールを実装する方法を説明します。 Posts テーブル、データ モデル、ダミー データのファクトリ、および投稿をロードするルートを特徴とする簡単な例を構築します。 フロントエンドは jQuery AJAX を使用してスクロール時にさらにデータを読み込みます。

ステップ 1: Laravel 11 のセットアップ (オプション)

まだ作成していない場合は、新しい Laravel 11 アプリケーションを作成します。

<code class="language-bash">composer create-project laravel/laravel example-app</code>

ステップ 2: MySQL データベースの構成

Laravel 11 のデフォルトは SQLite です。 MySQL を使用するには、.env ファイルを構成します:

<code>DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=your_database_name
DB_USERNAME=your_database_username
DB_PASSWORD=your_database_password</code>

プレースホルダーをデータベースの資格情報に置き換えます。

ステップ 3: データベースの移行

posts テーブルの移行を作成します:

<code class="language-bash">php artisan make:migration create_posts_table</code>

次のコードを移行ファイル (database/migrations にあります) に追加します: (移行テーブル構造のコードはここに挿入されます)。 適切なテーブルスキーマの作成については、Laravel ドキュメントを参照してください。

これでバックエンドのセットアップが完了しました。 さらなる手順には、Post モデル、データをシードするためのファクトリ、投稿をフェッチするルート、そして最後に、AJAX を使用して無限スクロール機能を処理するための JavaScript コードの作成が含まれます。 (これらの手順については、元の記事の後続のセクションで詳しく説明します)。

以上がLaravelのスクロール時にAjaxページネーションを使用してより多くのデータをロードする方法の例の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。