관리 양식 Ui 구성 요소 구성 파일에서 "소스"및 "dataScope"의 의미


11

Magento2 관리 양식 UI 구성 요소 구성 에는 소스dataScope 노드가 있습니다. 그들은 무엇을 의미하며 어떻게 사용되어야합니까?

<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>

답변:


20

대해서는 source노드

source데이터 배열의 노드 키의 값은 대응하여 리턴 \Magento\Framework\View\Element\UiComponent\DataProvider\DataProviderInterface::getData하여 UI 부품의 제조 방법.


예를 들어 customer_form UI를 생각해 봅시다 .
파일/Magento/Customer/view/base/ui_component/customer_form.xml

여기에서 대부분의 필드에서 Magento가 노드 customer아래의 값을 사용한다는 것을 알 수 있습니다 source.
그러나 addressfieldset 아래의 필드 가이 값이로 변경 될 때까지 기다리 십시오 address.

이제 customer_form UI 구성 요소에 해당하는 DataProvider 를 간단히 살펴 보겠습니다 . 수업은 입니다.
\Magento\Customer\Model\Customer\DataProvider

대략 getData이 클래스 의 메소드 는 customer_form 구성 요소가 선언 한 해당 필드에 채워진 데이터를 리턴합니다 .
지금 짐작할 수 있듯이 , 노드 의 고객 가치 는 메소드 에서 source주요 고객 아래에 저장된 값을 사용하도록 지시 getData하는 반면, 주소 는 반환 된 데이터에서 source주소 아래에 저장된 데이터를 가리 킵니다 .

자세히 살펴보기 : <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>

위의 필드 는 고객의 DataProvider가 반환 한 주요 고객 아래에 저장된 데이터에서 이름 값을 가져옵니다 .

아래의 경우 firstname 값의 소스는 키 주소 아래에 저장된 데이터입니다 . <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>


대해서는 dataScope노드

dataScope노드는이 값을 변경할 수 있습니다 이름 예를 들어, 사용자의 입력 (필드)의 속성을 <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> 다음과 같이 결과 입력 렌더링 될 것입니다 :<input name="field_name"...>

dataScope점으로 구분 된 노드에 값을 쓸 수도 있습니다 . customer.address.firstname이 경우 결과 입력은 다음과 같이 렌더링됩니다. <input name="customer[address][firstname]"...> 여기서 마술이 발생합니다 .

또한 dataScope노드 는 필드에 대해 검색된 값의 경로를 변경합니다 . 이는 연결 기술을 통해 달성됩니다 .


1

이것은 귀하의 필드가 "dataScope"값과 같이 POST에서 전송되는 것을 의미합니다. 예를 들어 포스트 요청은 다음과 같습니다. ['title'] => var


하나의 질문을 놓쳤습니다. 소스 의 의미는 무엇입니까 ? 데이터 소스 인 경우 인수가 page_listing_data_source가 아닌 page 인 이유는 무엇입니까?
Key Shang
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.