Skip to content
This repository was archived by the owner on Nov 19, 2024. It is now read-only.

Add brief detail of Ui component related to frontend and Adminhtml area #4503

Merged
merged 11 commits into from
May 21, 2019
Merged

Add brief detail of Ui component related to frontend and Adminhtml area #4503

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
6717b1a
Add brief detail of Ui component related to front and backend area
May 13, 2019
0bbfef5
add details to v2.1 and v2.2
May 15, 2019
c257d58
update changes
May 20, 2019
bd90c18
Example added for Ui component frontend area
May 20, 2019
2daa79c
Removed Specification
May 21, 2019
ea62c93
Added Example to version-2.1
May 21, 2019
d74a8f6
Update Example in version 2.2
May 21, 2019
6c29f85
Formatting.
dobooth May 21, 2019
7152b0b
Formatting.
dobooth May 21, 2019
2f18cb7
Formatting.
dobooth May 21, 2019
566dc91
Merge branch 'master' into devdoc-frontend-2
dobooth May 21, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 24 additions & 0 deletions guides/v2.1/ui_comp_guide/bk-ui_comps.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -103,6 +103,30 @@ A particular instance of a UI component is defined primarily by the following:
3. [Backend/PHP modifiers]({{ page.baseurl }}/ui_comp_guide/concepts/ui_comp_modifier_concept.html).
4. Configuration inside the JavaScript classes.

## UI component used in the frontend design area

* Configured through layout XML.

* The `jsLayout` argument is used to specify information.

```xml
<block name="block-name" template="Magento_Module::path_to_template.phtml">
<arguments>
<argument name="jsLayout" xsi:type="array">
<item name="components" xsi:type="array">
...
</item>
</argument>
</arguments>
</block>
```

## UI component used in the Adminhtml area

* Configured through dedicated XML file (view/.../ui_component/[ui_component_name.xml])

* Included in layout XML with uiComponent tag

## Things to remember when working with UI components

**UI components have different settings**
Expand Down
24 changes: 24 additions & 0 deletions guides/v2.2/ui_comp_guide/bk-ui_comps.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -103,6 +103,30 @@ A particular instance of a UI component is defined primarily by the following:
3. [Backend/PHP modifiers]({{ page.baseurl }}/ui_comp_guide/concepts/ui_comp_modifier_concept.html).
4. Configuration inside the JavaScript classes.

## UI component used in the frontend design area

* Configured through layout XML.

* The `jsLayout` argument is used to specify information.

```xml
<block name="block-name" template="Magento_Module::path_to_template.phtml">
<arguments>
<argument name="jsLayout" xsi:type="array">
<item name="components" xsi:type="array">
...
</item>
</argument>
</arguments>
</block>
```

## UI component used in the Adminhtml area

* Configured through dedicated XML file (view/.../ui_component/[ui_component_name.xml])

* Included in layout XML with uiComponent tag

## Things to remember when working with UI components

**UI components have different settings**
Expand Down
24 changes: 24 additions & 0 deletions guides/v2.3/ui_comp_guide/bk-ui_comps.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -105,6 +105,30 @@ A particular instance of a UI component is defined primarily by the following:
3. [Backend/PHP modifiers]({{ page.baseurl }}/ui_comp_guide/concepts/ui_comp_modifier_concept.html).
4. Configuration inside the JavaScript classes.

## UI component used in the frontend design area

* Configured through layout XML.

* The `jsLayout` argument is used to specify information.

```xml
<block name="block-name" template="Magento_Module::path_to_template.phtml">
<arguments>
<argument name="jsLayout" xsi:type="array">
<item name="components" xsi:type="array">
...
</item>
</argument>
</arguments>
</block>
```

## UI component used in the Adminhtml area

* Configured through dedicated XML file (view/.../ui_component/[ui_component_name.xml])

* Included in layout XML with uiComponent tag

## Things to remember when working with UI components

**UI components have different settings**
Expand Down