Maison > cadre php > Laravel > Comment résoudre la pagination Laravel sans style

Comment résoudre la pagination Laravel sans style

PHPz
Libérer: 2023-04-09 09:30:02
original
730 Les gens l'ont consulté

Laravel est un framework de développement moderne très populaire qui fournit un grand nombre de fonctionnalités et d'outils pratiques permettant aux développeurs de créer facilement des applications Web de haute qualité. L'une des fonctions courantes est la pagination. Laravel dispose également d'outils de pagination pratiques intégrés, mais de nombreux développeurs sont confrontés au problème des styles de pagination manquants. Cet article explique comment résoudre ce problème.

Pour utiliser la fonction de pagination de Laravel, nous pouvons effectuer des requêtes de pagination via le générateur de requêtes ou l'objet modèle Eloquent. Par exemple, le code suivant peut être utilisé pour interroger toutes les données utilisateur et les afficher en pagination :

use Illuminate\Support\Facades\DB;
use App\Models\User;

$users = DB::table('users')->paginate(10);

// 或者可以使用Eloquent模型对象进行分页查询

$users = User::paginate(10);
Copier après la connexion

Grâce au code ci-dessus, nous pouvons obtenir un objet de pagination $users, qui contient les données utilisateur de pagination actuelles, les liens associés à la pagination et d'autres attributs de pagination. Par défaut, l'outil de pagination de Laravel dispose de deux ensembles de styles de pagination intégrés : bootstrap et semantic-ui.

Mais si vous souhaitez utiliser différents styles de pagination, tels que votre propre style CSS défini, vous devez effectuer une configuration personnalisée.

Tout d'abord, nous devons créer un fichier de vue, qui servira de modèle pour notre style de pagination personnalisé. Nous pouvons créer un nouveau fichier modèle pagination.blade.php dans le répertoire resources/views/vendor/pagination/. Nous pouvons ensuite écrire les styles HTML et CSS dont nous avons besoin dans ce fichier. Voici un exemple simple :

<div class="pagination-style">
   <ul class="pagination">

       {{-- Previous Page Link --}}
       @if ($paginator->onFirstPage())
           <li class="disabled"><span>&laquo;</span></li>
       @else
           <li><a href="{{ $paginator->previousPageUrl() }}" rel="prev">&laquo;</a></li>
       @endif

       {{-- Next Page Link --}}
       @if ($paginator->hasMorePages())
           <li><a href="{{ $paginator->nextPageUrl() }}" rel="next">&raquo;</a></li>
       @else
           <li class="disabled"><span>&raquo;</span></li>
       @endif

       {{-- Pagination Elements --}}
       @foreach ($elements as $element)
           {{-- "Three Dots" Separator --}}
           @if (is_string($element))
               <li class="disabled"><span>{{ $element }}</span></li>
           @endif

           {{-- Array Of Links --}}
           @if (is_array($element))
               @foreach ($element as $page => $url)
                   @if ($page == $paginator->currentPage())
                       <li class="active"><span>{{ $page }}</span></li>
                   @else
                       <li><a href="{{ $url }}">{{ $page }}</a></li>
                   @endif
               @endforeach
           @endif
       @endforeach
   </ul>
</div>
Copier après la connexion

Dans le code ci-dessus, nous définissons nos propres styles CSS basés sur les styles Bootstrap et remplaçons le modèle de pagination par défaut de Laravel. Les détails spécifiques de l'implémentation incluent :

  1. Obtenez le lien de pagination via $paginator->previousPageUrl() et $paginator->nextPageUrl() et restituez-le en HTML
  2. Utilisez $is_string() pour déterminer si l'élément actuel est ; pagination "..." séparateur dans la liste, afin d'effectuer le rendu correspondant ;
  3. Utilisez $is_array() pour déterminer si l'élément actuel est un lien de numéro de page dans la liste de pagination, afin d'effectuer le rendu correspondant.

Ensuite, nous devons dire à Laravel que nous souhaitons utiliser un modèle de pagination personnalisé. Nous pouvons ajouter un nouvel élément de configuration dans /config/view.php :

'pagination' => 'vendor.pagination.pagination'
Copier après la connexion

Le supplier.pagination.pagination représente ici le chemin d'accès au fichier de modèle de pagination que nous venons de créer.

Enfin, dans le fichier d'affichage, nous pouvons appeler notre modèle de pagination personnalisé de la manière suivante :

{{ $users->links('vendor.pagination.pagination') }}
Copier après la connexion

Grâce aux étapes ci-dessus, nous pouvons personnaliser notre propre style de pagination dans Laravel. Bien sûr, si vous souhaitez implémenter un style de pagination plus riche, vous pouvez le faire en étendant la fonction de pagination de Laravel.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal