Magento 2: Para que serve a pasta `ui

8

Além de conter pastas familiares como layout, e templates, a viewpasta de um módulo Magento 2 também contém uma ui_componentsubpasta.

view/adminhtml/ui_component

Para que serve esta pasta? Parece ter algo a ver com renderização de interfaces de usuário no back-end, mas não está claro como eu, como desenvolvedor do módulo Magento, usaria os arquivos nessa pasta. Isso é algo reservado para os módulos principais do Magento que não possuem funcionalidade exposta para desenvolvedores de terceiros, ou posso usá-lo para reutilizar os componentes da interface do Magento e / ou criar meus próprios componentes? Se sim, como?

magento2 xml uicomponent view Alan Storm
fonte

7

O diretório ui_component contém a definição xml da grade (ou formulário) usada no back-end. Dentro do arquivo de layout, você pode fazer referência ao componente da interface do usuário com:

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
   <update handle="styles"/>
   <body>
       <referenceContainer name="content">
           <uiComponent name="sample_demolist_listing"/>
       </referenceContainer>
   </body>
</page>

Isso carregará o arquivo: view / adminhtml / ui_component / sample_demolist_listing.xml, aqui você define (para uma grade) qual fonte de dados você deseja usar, quais campos disponíveis para mostrar, campos que você deseja filtrar e ações em massa. Consulte https://github.com/Genmato/M2_Sample/blob/7c0c771c4d66f2ea4eec285bfb9f8ad5d1c67999/view/adminhtml/ui_component/sample_demolist_listing.xml (o arquivo é um pouco grande demais para ser incluído aqui).

A fonte de dados é referenciada no ui_component xml e é criada através do di.xml, definindo:

<type name="Magento\Framework\View\Element\UiComponent\DataProvider\CollectionFactory">
        <arguments>
            <argument name="collections" xsi:type="array">
                <item name="sample_demolist_listing_data_source" xsi:type="string">Genmato\Sample\Model\ResourceModel\Demo\Grid\Collection</item>
            </argument>
        </arguments>
    </type>

Nesse caso, a coleção é usada Model\ResourceModel\Demo\Grid\Collection.

Consulte https://github.com/Genmato/M2_Sample/releases/tag/0.7.6 para uso em seu próprio módulo.

Vladimir Kerkhoff
fonte

7

Esta pasta contém a declaração da interface do usuário baseada em componentes da interface do usuário (como grades e formulários). Atualmente, ele é usado principalmente na área adminhtml , porque o Painel do administrador tem muitas interfaces CRUD que possuem a mesma estrutura.

Todas as novas interfaces no painel de administração serão construídas com componentes da interface do usuário e também é uma tecnologia recomendada para o desenvolvimento de módulos.

KAndy
fonte

+1 para informações úteis - você conhece algum tutorial / recurso que explique como eles funcionam?

Alan Storm

11

Talvez o módulo de amostra seja útil para você

KAndy

Cada nó aqui fica explicado por este tutorial: ashsmith.io/magento2/module-from-scratch-part-5-adminhtml

Luuk Skeur

Magento 2: Para que serve a pasta `ui_component`?

Respostas: