Home   >   Design • Entities • vFlow 2.0   >   Subcomponent

Subcomponent

The Subcomponent element allows one component to be embedded within another while retaining its original properties. This enables reuse of components across different sections of the application.

For example, if a Table component needs to be displayed within a List component, a Subcomponent element can be created under the List component, and the Table component can be mapped to it. This element ensures that the Table component retains its properties that were defined during its creation while being embedded within the List component.

This subcomponent element support is available under List (Template 4).

Common Use Cases:

  • Component Embedding: Inserts a component (e.g., Table) inside another (e.g., List).
  • Modular UI Design: Reuses components across multiple sections.
  • Dynamic Content Mapping: Displays nested components while maintaining their configuration.

Configuration

The element’s configuration in vFlow 2.0 allows you to customize its behavior, appearance, and interaction across various devices. Through simple settings, you can control everything from its visibility and functionality to how it adapts to different screen sizes, making it flexible and user-friendly for developers and end-users. Let’s have a look at each of its configurations:

Basic

Basic ConfigurationDescription
TypeThe Type indicates the type of element you are configuring. In this case, it defaults to “Subcomponent” and cannot be changed here. This selection is made initially when you first create the element.
Reference NameThe Reference Name is a unique identifier assigned to the element for internal use. This name is visible only to vFlow users, and is not displayed to end-users. The Reference Name is intended for your convenience, helping you easily identify and manage the element throughout.
LabelThe Label is the name or text displayed on the element, making it easily recognizable to end-users.
DescriptionThe Description field is intended for use by application designers or administrators (vFlow users) to provide additional context or details about the element. This description is not visible to end-users and is used solely for internal reference to assist with element management.

Properties

Subcomponent ID: Find the component by its Reference Name in the dropdown list of components eligible for embedding.

Note that all the components can not be embedded, so this dropdown list has only embeddable components.

Was this article helpful?
YesNo