Laravel项目使用links()方法分页显示多种样式,需仅保留一种
嘿,我来帮你搞定这个分页样式重复的麻烦!你说页面上显示了3-4种能正常工作的分页样式,但只想要一种,而且没改过CSS/JS,那大概率是这几个原因,咱们一步步排查:
1. 先检查模板里是不是重复调用了分页方法
你先打开对应的Blade模板,找找所有写了{{ $items->links() }}的地方——会不会是不小心在不同位置重复输出了分页导航?比如列表上方和下方各放了一次?如果是这样,删掉多余的调用,只留一个就行。
2. 指定明确的分页视图,避免样式混合
Laravel默认支持好几种分页视图(比如Bootstrap、Tailwind风格),如果没指定的话,可能项目里同时加载了多种框架的CSS,导致默认的分页HTML被不同样式叠加,看起来像多种样式。
你可以直接在调用links()时指定你想要的视图,比如想用Bootstrap 5的样式:
{{ $items->links('pagination::bootstrap-5') }}
或者想用Tailwind的样式:
{{ $items->links('pagination::tailwind') }}
这样Laravel会渲染对应风格的分页HTML,不会乱套。
3. 检查项目里的CSS资源是不是重复引入了
有没有可能你的项目同时引入了Bootstrap和Tailwind的CSS?比如在布局文件app.blade.php里既加了Bootstrap的CDN链接,又引入了Tailwind的编译CSS?这两种框架的样式会同时作用在分页元素上,导致看起来像多种样式。
你只需要保留你需要的那一种框架的CSS,把另一个的引入删掉就行。比如用Bootstrap就删Tailwind的CSS,反之亦然。
4. 重置自定义的分页视图(如果之前改过)
如果你之前用php artisan vendor:publish --tag=laravel-pagination命令把分页视图发布到了本地的resources/views/vendor/pagination目录,那里面可能有多种不同的视图文件,甚至你不小心修改过导致样式混乱。
这种情况的话,你可以直接删掉resources/views/vendor/pagination这个目录,Laravel会自动使用官方默认的分页视图;或者只保留你需要的那个视图文件,删掉其他的。
按照上面的步骤排查,应该就能只保留一种你想要的分页样式啦!
内容的提问来源于stack exchange,提问作者Emiljano

