Yii2 Как добавить картинки в ссылку в виджете Меню(ссылки грузятся из базы)?

В Yii2 можно добавить картинки к ссылкам в виджете Меню, используя HTML-код в свойстве 'label' элементов меню. Предположим, что ссылки для меню загружаются из базы данных. В таком случае, вам нужно будет изменить модель данных для хранения не только самих ссылок, но и путей к картинкам.

Первым шагом нужно обновить модель данных, добавив новое поле для хранения пути к картинке. Например, вы можете создать поле 'image' в таблице базы данных.

Отредактируйте соответствующую модель Yii2, добавив это поле:

<?php

namespace appmodels;

use Yii;
use yiidbActiveRecord;

class Menu extends ActiveRecord
{
    public static function tableName()
    {
        return 'menu';
    }
    
    public function rules()
    {
        return [
            [['label', 'url', 'image'], 'required'],
            [['label', 'url', 'image'], 'string'],
        ];
    }
}

После этого заполните таблицу базы данных значениями, включая пути к картинкам для каждого элемента меню.

Далее, в представлении, где вы используете виджет Меню, вы можете изменить его шаблон через свойство 'linkTemplate'. Помимо этого, придется использовать свойство 'labelTemplate'.

<?= yiiwidgetsMenu::widget([
    'items' => $items,
    'linkTemplate' => '<a href="{url}"><img src="{image}" alt="{label}"></a>',
    'options' => ['class' => 'navbar-nav'],
]) ?>

В примере выше мы добавили HTML-код для отображения картинки внутри ссылки в виджет Меню. Мы использовали свойство 'linkTemplate', чтобы добавить тег <img> внутри ссылки.

Кроме того, также нужно изменить метод, который получает данные из базы данных и формирует массив элементов меню для передачи его в виджет Меню. Например:

public function actionIndex()
{
    $menuItems = Menu::find()->all();

    $items = [];
    foreach ($menuItems as $menuItem) {
        $items[] = [
            'label' => $menuItem->label,
            'url' => $menuItem->url,
            'image' => $menuItem->image,
        ];
    }

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

Это пример кода, который получает элементы меню из базы данных и передает их в представление. В приведенном выше коде мы добавили поле 'image' в массив элементов меню, чтобы передать путь к картинке в виджет Меню.

Наконец, в вашем представлении меню должно отображаться с изображениями, которые теперь связаны с каждым элементом меню из базы данных.

Обратите внимание, что вы можете настроить CSS-стили для изображений, чтобы они отображались в нужном виде. Приведенный выше код предоставляет лишь базовый пример того, как добавить картинки к ссылкам в виджете Меню в Yii2.