Підступна війна росії проти України. Орієнтовні втрати ворога
(станом на 06.10.2022)
61330
осіб
264
літаків
225
гелікоптерів
2449
танків
5064
ББМ
1424
артилерія
176
ППО
344
РСЗВ
3854
машин
15
кораблі і катери
Як створити вигляд (view) для модуля в Magento 2

Як створити вигляд (view) для модуля в Magento 2

У сьогоднішньому уроці ви дізнаєтеся, як створити View (вигляд або представлення) та його дію в Magento 2. У попередньому уроці ми розглянули питання створення контролера для Magento 2, а сьогодні ви побачите, як зв’язати вигляд (шаблон) з нашою дією! Ми будемо використовувати заготовки з попереднього уроку.

 

 

Додайте папку view в корінь модуля

Створіть папку view в корені модуля /Sebweo/Test. Саме ця папка буде містити весь макет (файли макета для Блоку, який буде відображатися на сайті, і шаблони). Створіть у цій папці каталог frontend, в якому створіть 2 папки: layout (для макетів) і templates (для файлів шаблонів).

 

 

Додайте phtml файл шаблону

Створіть файл test_view.phtml в папці /Sebweo/Test/view/frontend/templates/ з таким контентом:

<div class="test_block">
 <p>Тестовий блок</p>
</div>

 

Тут ми будемо відображати html-контент, який буде доступний в дії (action) testuvannya/perevirka/index (див. попередній урок).

 

 

Додайте файл макета для дії

Тепер ми зв’яжемо нашу дію з нашим контролером і шаблоном. Для цього створіть файл testuvannya_perevirka_index.xml (зверніть увагу на назву <id_маршрута>_<назва_контролера>_<назва_дії>) в каталозі /Sebweo/Test/view/frontend/layout/, з таким вмістом:

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
 <body>
  <referenceContainer name="content">
    <block class="Magento\Framework\View\Element\Template" name="testBlock" template="Sebweo_Test::test_view.phtml"></block>
  </referenceContainer>
 </body>
</page>

 

 

Ім’я файлу дуже важливе. Для маршруту (URL) testuvannya/perevirka/index ми повинні назвати наш файл макета testuvannya_perevirka_index.xml, щоб Magento 2 автоматично отримав наш файл макета з дії. Вам просто потрібно замінити “/” в URL дії на “_“, і ви отримаєте ім’я файлу макета.

 

 

Для чого потрібен цей файл?

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">

 

Ця інструкція повідомляє Magento 2, що ми оновлюємо макет цієї дії за допомогою шаблону 1column.phtml.

 

<body>
 <referenceContainer name="content">
  <block class="Magento\Framework\View\Element\Template" name="testBlock" template="Sebweo_Test::test_view.phtml"></block>
 </referenceContainer>
</body>

 

Нод referenceBlock дозволяє Magento 2 отримати блок з відповідним ім’ям (тут content).

Нод block дозволяє Magento 2 додавати новий Блок, тут цей блок буде використовувати логічний клас Magento\Framework\View\Element\Template, носитиме ім’я testBlock, і йому буде присвоєно файл шаблону test_view.phtml, який знаходиться в модулі Sebweo_Test.

 

Цей блок XML коду дозволяє вам створити блок в області content (вмісту) веб-сайту і використовувати файл-шаблон test_view.phtml, який ми створили раніше.

Зверніть увагу, що тут ми використовуємо клас Magento\Framework\View\Element\Template, який є основним класом, що дозволяє відображати .phtml шаблон без спеціальної логіки.

 

 

Відредагуйте дію, щоб отримати його макет

Magento 2 для отримання файлу макета, потрібна його завантаження за допомогою методу loadLayout(). А відображає він його за допомогою функції renderLayout().

 

Відредагуйте файл /Sebweo/Test/Controller/Perevirka/Index.php наступним чином:

namespace Sebweo\Test\Controller\Perevirka;
class Index extends \Magento\Framework\App\Action\Action
{
 public function execute()
 {
  $this->_view->loadLayout();
  $this->_view->renderLayout();
 }
}

 

І тепер ви можете отримати доступ до вашого шаблону через URL-адресу, яка описана в попередньому уроці: {DOMEN}/testuvannya/perevirka/index/.

 

 

Тепер ви знаєте, як додати вигляд (view), пов’язаний з дією вашого контролера Magento 2. Прийміть наші вітання!

До наступних уроків.

 

 

Напишіть тут свою думку/питання

Ваша пошта не публікуватиметься.