Главная/Статьи/YII2 Как создать представление ListView + исходники
Yii2

YII2 Как создать представление ListView + исходники

Виджет ListView в Yii2 — удобный инструмент для отображения записей из базы данных с пагинацией. Он гибко настраивается и позволяет использовать как шаблонные файлы, так и callback-функции для рендеринга элементов.

Подготовка

Создайте проект Yii2 с таблицей в БД (например, post) и соответствующей моделью. Экшн контроллера должен использовать ActiveDataProvider с пагинацией на 10 записей:

public function actionIndex()
{
    $dataProvider = new ActiveDataProvider([
        'query' => Post::find(),
        'pagination' => [
            'pageSize' => 10,
        ],
    ]);

    return $this->render('index', [
        'dataProvider' => $dataProvider,
    ]);
}

Конфигурация ListView

Основные параметры виджета:

dataProvider — источник данных, обычно экземпляр ActiveDataProvider.

options — HTML-атрибуты обёртки, позволяют задать кастомные классы и ID.

layout — структура разметки, дефолтное значение {summary}\\n{items}\\n{pager}. Можно переставить блоки местами.

itemView — принимает имя файла шаблона или callback-функцию. При использовании строки доступны переменные $model, $key, $index и $widget.

 $dataProvider,
    'options' => ['class' => 'post-list'],
    'layout' => "{pager}\\n{items}\\n{summary}",
    'itemView' => '_post',
    'pager' => [
        'firstPageLabel' => 'Первая',
        'lastPageLabel' => 'Последняя',
        'nextPageLabel' => 'Следующая',
        'prevPageLabel' => 'Предыдущая',
    ],
]) ?>

Рендеринг через callback

Альтернативный способ через анонимную функцию:

'itemView' => function($model, $key, $index, $widget) {
    return Html::tag('div', $model->title, ['class' => 'post-item']);
},

Полные исходники примера доступны на GitHub автора. Виджет реализует Bootstrap-пагинацию по умолчанию, но её можно полностью настроить под свои нужды.