O que significa "source" e "dataScope" no arquivo de configuração do componente Ui do formulário de administração


11

Existem nós de origem e dataScope na configuração do componente de interface do usuário do Magento2 admin form. O que eles significam e como devem ser usados?

<field name="title">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="dataType" xsi:type="string">text</item>
            <item name="label" xsi:type="string" translate="true">Page Title</item>
            <item name="formElement" xsi:type="string">input</item>
            <item name="source" xsi:type="string">page</item>
            <item name="sortOrder" xsi:type="number">20</item>
            <item name="dataScope" xsi:type="string">title</item>
            <item name="validation" xsi:type="array">
                <item name="required-entry" xsi:type="boolean">true</item>
            </item>
        </item>
    </argument>
</field>

Respostas:


20

Em relação ao source

O sourcevalor do nó corresponde a uma chave na matriz de dados retornada pelo \Magento\Framework\View\Element\UiComponent\DataProvider\DataProviderInterface::getDatamétodo do seu componente de interface do usuário.


Por exemplo, vamos considerar a interface do usuário customer_form .
Arquivo/Magento/Customer/view/base/ui_component/customer_form.xml

A partir daqui, você pode ver que, na maioria dos campos, o Magento usa o customervalor sob o sourcenó.
Mas espere, para os campos no addressfieldset esse valor foi alterado para address.

Agora, vamos dar uma breve olhada no DataProvider correspondente para o componente de interface do usuário customer_form .
A turma é \Magento\Customer\Model\Customer\DataProvider.

Grosso modo, o método getDatadessa classe é responsável pelo retorno de dados preenchidos para os campos correspondentes declarados pelo componente customer_form .
Como você pode adivinhar agora, o valor do cliente do sourcenó nos diz para usar o valor armazenado no cliente principal no getDatamétodo, enquanto o endereço source aponta para os dados armazenados no endereço principal nos dados retornados.

Olhar mais atento: <field name="firstname" formElement="input"> <argument name="data" xsi:type="array"> <item name="config" xsi:type="array"> item name="source" xsi:type="string">customer</item> </item> </argument> </field>

O campo acima obtém seu valor de primeiro nome dos dados armazenados no cliente principal retornado pelo DataProvider do cliente .

Enquanto no caso abaixo, a fonte do valor do primeiro nome são os dados armazenados no endereço da chave : <field name="firstname" formElement="input"> <argument name="data" xsi:type="array"> <item name="config" xsi:type="array"> <item name="source" xsi:type="string">address</item> </item> </argument> </field>


Em relação ao dataScope

O dataScopenó permite alterar um valor para o atributo name da sua entrada (campo), por exemplo, <field name="title"> <argument name="data" xsi:type="array"> <item name="config" xsi:type="array"> <item name="dataType" xsi:type="string">text</item> <item name="formElement" xsi:type="string">input</item <item name="dataScope" xsi:type="string">field_name</item> </item> </argument> </field> A entrada do resultado será renderizada da seguinte forma:<input name="field_name"...>

Você também pode gravar os valores no dataScopenó separados por pontos: customer.address.firstnamenesse caso, a entrada do resultado é renderizada da seguinte maneira: <input name="customer[address][firstname]"...> Aqui é onde a mágica acontece .

Além disso, o dataScopealtera o caminho do valor recuperado para um campo. Isto é conseguido através da técnica de ligação .


1

isso significa que o seu campo será enviado no POST como o valor "dataScope"; na sua situação, por exemplo, a solicitação posterior será como ['title'] => var


Você perdeu uma pergunta. Qual é o significado da fonte ? Se for fonte de dados, por que o argumento é page , não page_listing_data_source ?
Key Shang
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.