Pakiet KnpMenuBundle pozwala w prosty sposób implementować menu do strony. Można tworzyć dowolne zagnieżdżenia elementów menu, które są automatycznie renderowane. Oczywiście zalet jest więcej 🙂 W tym artykule skupimy się na podstawach, czyli instalacji, konfiguracji i użyciu menu w kontrolerze, a następnie wyrenderowaniu go na stronie.
Zaczniemy od instalacji bundla z wiersza poleceń:
1 |
$ composer require knplabs/knp-menu-bundle |
Po poprawnej instalacji pakietu, zaktualizuj plik bundles.php (config/bundles.php):
1 2 3 4 5 6 |
<?php return [ // ... Knp\Bundle\MenuBundle\KnpMenuBundle::class => ['all' => true], ]; |
Następnie tworzymy klasę Builder.php (src/Menu/Builder.php), w której budujemy menu. W tym celu zapisujemy funkcję o nazwie np: MyMenu, a wewnątrz niej dodajemy elementy menu (addChild) wraz z odnośnikami (parametr route).
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
<?php namespace App\Menu; use Knp\Menu\FactoryInterface; use Symfony\Component\HttpFoundation\RequestStack; class Builder { private $factory; /** * @param FactoryInterface $factory */ public function __construct(FactoryInterface $factory) { $this->factory = $factory; } public function MyMenu(RequestStack $requestStack) { $menu = $this->factory->createItem('root'); $menu->addChild('Home', ['route' => 'home']); $menu->addChild('About', ['route' => '#']); $menu->addChild('Blog', ['route' => '#']); $menu->addChild('Contact', ['route' => '#']); // ... etc return $menu; } } |
Parametr route identyfikuje się z @Route kontrolera np: name=”home„ :
1 2 3 4 5 6 7 8 9 10 11 12 |
// src/Controller/TestController.php // ... /** * @Route("/home", name="home") */ public function Index() { return $this->render('templates/home.html.twig', []); } // ... |
Oczywiście w tym przykładzie zapodałem najprostszy przypadek, czyli menu jednopoziomowe. Elementy menu możesz zagnieżdżać według schematu:
1 |
$menu['Root']->addChild('Level', ['route' => 'name']); |
W kolejnym kroku, wprowadzamy konfigurację powyższego menu do pliku services.yaml (config/services.yaml):
1 2 3 4 5 6 7 8 9 10 11 12 |
services: app.menu_builder: class: App\Menu\Builder arguments: ["@knp_menu.factory"] app.main_menu: class: Knp\Menu\MenuItem factory: ["@app.menu_builder", MyMenu] arguments: ["@request_stack"] tags: - { name: knp_menu.menu, alias: navigator } |
- w app.menu.builder definiujemy naszą klasę podając class: App\Menu\Builder
- w app.main_menu dodajemy dla atrybutu factory nazwę metody MyMenu
- w tagach (tags) wprowadzamy dla naszego menu dowolny alias, np: navigator
Alias navigator wprowadzamy do funkcji knp_menu_render , która wyrenderuje menu w szablonie (np: templates/base.html.twig):
1 2 3 |
... {{ knp_menu_render('navigator') }} ... |
Czytaj ciąg dalszy tego tematu: DYNAMICZNE MENU W SYMFONY 4 + KNPMENUBUNDLE