模板和布局渲染

Magento 2提供了一种强大的机制，可以使用自定义模板扩展电子商务功能。它还允许通过使用声明性方法提供额外的内容。

Lesson Overview

在本课程中，我们将学习以下内容：

如何创建模板？
如何在自定义的Magento 2页面上呈现模板？
如何通过布局配置文件添加模板？

Before we begin

这是模块的结构，我们将从以下内容开始：

对于本教程，我创建了MageMastery_FirstLayout 模块，registration.php 和 module.xml。模块已经通过bin/magento setup:upgrade 终端命令成功注册。

registration.php文件如下

<?php

use Magento\Framework\Component\ComponentRegistrar;

ComponentRegistrar::register(
    ComponentRegistrar::MODULE,
    'MageMastery_FirstLayout',
    __DIR__
);

module.xml文件如下：

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
    <module name="MageMastery_FirstLayout" />
</config>

有关模块创建和注册的更多信息，请参阅上一课《 Magento 2中的模块》。

除此之外，我还添加了route.xml带有Action Controller类的文件。这两个文件允许访问MageMastery_FirstLayout模块中已声明的自定义页面。

该routes.xml文件内容如下：

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
xsi:noNamespaceSchemaLocation="urn:magento:framework:App/etc/routes.xsd">
    <router id="standard">
        <route id="magemastery_firstlayout" frontName="firstlayout">
            <module name="MageMastery_FirstLayout" />
        </route>
    </router>
</config>

route.xml文件位于MageMastery/FirstLayout/etc/frontend目录中。此配置允许使用URL的“ firstlayout” URI路径访问模块的控制器。

而Action控制器类位于MageMastery/FirstLayout/Controller/Page/View.php文件中，内容为：

<?php

declare(strict_types=1);

namespace MageMastery\FirstLayout\Controller\Page;

use Magento\Framework\App\Action\Action;
use Magento\Framework\Controller\ResultFactory;
use Magento\Framework\View\Result\Page;

class View extends Action
{
    public function execute()
    {
        /** @var Page $resultPage */
        return $this->resultFactory->create(ResultFactory::TYPE_PAGE);
    }
}

New Page Type Object

在Magento的“创建页面”2课中，我们学习了如何创建自定义页面并返回json格式的数据。您已经注意到，有一个从execute()方法返回Magento\Framework\View\Result\Page 的一个对象实例。

return $this->resultFactory->create(ResultFactory::TYPE_PAGE);

创建了一个TYPE_PAGE 对象的结果，背后的思想是触发Magento 2呈现机制（渲染）。

Rendering

在本课中，我们将学习一个新目录。该目录称为view。正如我们在上一教程中讨论的那样，Magento 2应用程序使用不同的配置区域。它也适用于渲染目的。前端和adminhtml是我们可以用来在Storefront和Admin区域上相应呈现自定义内容的两个区域。

这是我们在本课中要学习的一个新目录。该目录称为view。正如我们在上一教程中所讨论的，Magento 2应用程序使用不同的配置区域。它也适用于渲染目的。我们可以使用frontend和adminhtml在店面和管理区域上相应地呈现定制内容。

目录中可能还有其他文件和目录view，但是，这不在本课程之内。在接下来的课程中，我们将学习不同的渲染区域，以及如何使用它为不同的区域提供不同的文件。

如果我们想在Storefront,(店面中)呈现某些内容，则必须创建一个view/frontend目录。在此目录内，应添加所有文件，并进一步在前端区域中执行这些文件。这会在Magento 2渲染时发生。在frontend目录内部，有两个目录。layout目录用于放置MageMastery_FirstLayout模块的布局配置文件。

templates目录包含必须在Magento 2店面中呈现的PHTML模板

Layout Configuration File

必须将新的magemastery_firstlayout_page_view.xml布局配置文件添加到MageMastery/FirstLayout/view/frontend/layout目录中。

创建magemastery_firstlayout_page_view.xml 文件，为该文件添加如下代码：

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

生活点点