在TP6.0引入Bootstrap4分页样式显示效果不正常

2023-02-16 09:52:05 浏览数 (3)

TP6.0 默认提供的分页代码中css样式类名是Bootstrap3中的,如果项目中使用的是Bootstrap4,则不能正确展示分页样式效果,需要修改分页驱动,使其样式正确显示
1. TP6.0 默认分页

默认分页驱动类文件

代码语言:javascript复制
vendor/topthink/think-orm/src/paginator/driver/Bootstrap.php

默认分页代码

代码语言:javascript复制
<ul class="pagination">    <li><a href="?page=1">&laquo;</a></li>    <li><a href="?page=1">1</a></li>    <li class="active"><span>2</span></li>    <li class="disabled"><span>&raquo;</span></li></ul>
2. 修改默认分页驱动

a. 复制默认分页驱动类

代码语言:javascript复制
vendor/topthink/think-orm/src/paginator/driver/Bootstrap.php

b. 粘贴到 app/driver 目录下,重命名为 MyPage、修改命名空间

代码语言:javascript复制
app/driver/MyPage.php

c. 修改文件 app/provider.php,添加以下内容

代码语言:javascript复制
// 修改默认分页驱动'thinkPaginator'    =>    appdriverMyPage::class,

d. 修改自定义分页驱动文件 app/driver/MyPage.php

代码语言:javascript复制
给 li 添加 .page-item,给 a 标签 和 span 标签添加 .page-link

e. 修改前和修改后的对比

站长百科网

f. 修改后的分页驱动,在 Bootstrap4.x 中可直接使用

代码语言:javascript复制
<?phpnamespace appdriver;use thinkPaginator;/** * Bootstrap 分页驱动 */class MyPage extends Paginator{    /**     * 上一页按钮     * @param string $text     * @return string     */    protected function getPreviousButton(string $text = "&laquo;"): string    {        if ($this->currentPage() <= 1) {            return $this->getDisabledTextWrapper($text);        }        $url = $this->url(            $this->currentPage() - 1        );        return $this->getPageLinkWrapper($url, $text);    }    /**     * 下一页按钮     * @param string $text     * @return string     */    protected function getNextButton(string $text = '&raquo;'): string    {        if (!$this->hasMore) {            return $this->getDisabledTextWrapper($text);        }        $url = $this->url($this->currentPage()   1);        return $this->getPageLinkWrapper($url, $text);    }    /**     * 页码按钮     * @return string     */    protected function getLinks(): string    {        if ($this->simple) {            return '';        }        $block = [            'first'  => null,            'slider' => null,            'last'   => null,        ];        $side   = 3;        $window = $side * 2;        if ($this->lastPage < $window   6) {            $block['first'] = $this->getUrlRange(1, $this->lastPage);        } elseif ($this->currentPage <= $window) {            $block['first'] = $this->getUrlRange(1, $window   2);            $block['last']  = $this->getUrlRange($this->lastPage - 1, $this->lastPage);        } elseif ($this->currentPage > ($this->lastPage - $window)) {            $block['first'] = $this->getUrlRange(1, 2);            $block['last']  = $this->getUrlRange($this->lastPage - ($window   2), $this->lastPage);        } else {            $block['first']  = $this->getUrlRange(1, 2);            $block['slider'] = $this->getUrlRange($this->currentPage - $side, $this->currentPage   $side);            $block['last']   = $this->getUrlRange($this->lastPage - 1, $this->lastPage);        }        $html = '';        if (is_array($block['first'])) {            $html .= $this->getUrlLinks($block['first']);        }        if (is_array($block['slider'])) {            $html .= $this->getDots

1 人点赞