UI listing Understanding

Question

What does this line do?

 <item name="provider" xsi:type="string">order_listing.entity_listing_data_source1</item>
 <item name="deps" xsi:type="string">order_listing.entity_listing_data_source1</item>

What is the difference between provider and deps?

why "order_listing.entity_listing_data_source1" is same value on both provider and deps?

Answer 1

A good way to keep configuration data out of the javascript is to declare a provider in the base component’s XML so it will be able to find that data provider component. Under the node, add a node like this (where [ComponentName] is the name of the component):

<item name="js_config" xsi:type="array">
    <item name="provider" xsi:type="string">[ComponentName].[ComponentName]_data_source</item>
</item>

This example declares the name of the data provider class and will be output in the JSON that contains the UI component’s configuration. It can then be used to locate the data source component. This is essentially declaring a variable that will be available to a javascript class.

Nodes are optional and contain parameters required for component:

• settings -> deps - sets the dependency on component initialization
• js_config -> provider - specifies the name of the component data
• settings -> layout - configuration class meets the visualization component. Names for deps and provider are specified with a complete path from the root component with the separator “.”

References:

https://devdocs.magento.com/guides/v2.3/ui_comp_guide/concepts/ui_comp_data_source.html

https://devdocs.magento.com/guides/v2.3/ui_comp_guide/components/ui-form.html

I hope this will help, as I try to cover all aspects