magento 2 管理表单 ui 组件答案

【问题标题】：magento 2 admin form ui componentmagento 2 管理表单 ui 组件
【发布时间】：2022-06-12 19:06:43
【问题描述】：

我想创建带有标签的 ui 组件。我希望我的基础数据显示在常规选项卡中，并在下一个选项卡中显示。

ui 组件

<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
    <argument name="data" xsi:type="array">
        <item name="js_config" xsi:type="array">
            <item name="provider" xsi:type="string">my_blog_form.my_blog_listing_data_source</item>
            <item name="deps" xsi:type="string">my_blog_form.my_blog_listing_data_source</item>
        </item>
        <item name="label" xsi:type="string" translate="true">General</item>
        <item name="layout" xsi:type="array">
            <item name="type" xsi:type="string">tabs</item>
            <item name="navContainerName" xsi:type="string">left</item>
        </item>
        <item name="buttons" xsi:type="array">
            <item name="save" xsi:type="array">
                <item name="name" xsi:type="string">save</item>
                <item name="label" xsi:type="string" translate="true">Save</item>
                <item name="class" xsi:type="string">primary</item>
                <item name="url" xsi:type="string">*/*/save</item>
            </item>
        </item>
    </argument>

    <dataSource name="my_blog_form_data_source">
        <argument name="dataProvider" xsi:type="configurableObject">
            <argument name="class" xsi:type="string">MY\Blog\Ui\DataProvider</argument>
            <argument name="name" xsi:type="string">my_blog_form_data_source</argument>
            <argument name="primaryFieldName" xsi:type="string">id</argument>
            <argument name="requestFieldName" xsi:type="string">id</argument>
            <argument name="collectionFactory" xsi:type="object">
                \MY\Blog\Model\Post\ResourceModel\Post\CollectionFactory
            </argument>
        </argument>
    </dataSource>
    <fieldset name="general">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="label" xsi:type="string" translate="true">Sample Fieldset</item>
            </item>
        </argument>

        <!-- This field has data type 'text' and standard 'input' form element and looks like input -->
        <field name="title">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="label" xsi:type="string">Title</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="dataType" xsi:type="string">text</item>
                    <item name="formElement" xsi:type="string">input</item>
                    <item name="source" xsi:type="string">title</item>
                </item>
            </argument>
        </field>
    </fieldset>
</form>

对应的数据源

<?php

namespace MY\Blog\Ui;

use Magento\Ui\DataProvider\AbstractDataProvider;
use \My\Blog\Model\Post\ResourceModel\Post\CollectionFactory;

class DataProvider extends AbstractDataProvider
{
    protected $collection;

    public function __construct(
        $name,
        $primaryFieldName,
        $requestFieldName,
        CollectionFactory $collectionFactory,
        array $meta = [],
        array $data = []
    ) {
        parent::__construct($name, $primaryFieldName, $requestFieldName, $meta, $data);
        $this->collection = $collectionFactory->create();
    }


    public function getData()
    {
        return [];
        $results = [];
//        var_dump($this->collection->getItems());die();
        foreach ($this->collection->getItems() as $item) {
            $results[$item->getId()]['general'] = $item->getData();
        }
        return $results;
    }
}

我没有看到任何标签，并且微调器永远不会停止。我在这里错过了什么，我得到了 0 个控制台错误。模型有效，因为我有显示我的数据的工作数据网格。

【问题讨论】：

标签： magento2 admin

【解决方案1】：

1. Add this in your form XML

<settings>
        <deps>
            <dep>my_blog_form.my_blog_listing_data_source</dep>
        </deps>
        <layout>
            <navContainerName>left</navContainerName>
            <type>tabs</type>
        </layout>
</settings>
2. set layout 2-coulmn left like this 
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="admin-2columns-left" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
  <body>
    <referenceContainer name="content">
      <uiComponent name="your_form_name" />
    </referenceContainer>
  </body>
</page>

【讨论】：