Skip to content

<ModulesRenderer>

INFO

Built-in components do not require registration and can be directly used in the template.

The <ModulesRenderer> component is used to render specific module content, suitable for scenarios that require dynamic rendering of module items. It must be used within the context of a <Provider> component and accepts an item property, which is used to pass the module data to be rendered.

Parameters

  • item (Object):
    • The module item to be rendered, usually an object containing detailed data for the module.
    • Example: item.items[0], where items is an array containing multiple module items, and [0] refers to one of the modules.

Usage Example

Basic Example

In the basic usage, the <ModulesRenderer> component will render the corresponding module content based on the passed item:

vue
<template>
    <ModulesRenderer :item="item.items[0]" />
</template>

In the example above, item.items[0] is the module data passed in, and the <ModulesRenderer> will render the corresponding module based on this data.

Configuration and Customization

The <ModulesRenderer> will automatically render the related content based on the passed module data. You can control the rendering of different module items by dynamically changing the item data.

Notes

  • Ensure that the <ModulesRenderer> component is always used within the context of the <Provider> component, as it depends on the global state or functionality provided by the Provider.
  • The item data must be a valid module data object containing the content and configuration to be rendered.

Using with Other Components

The <ModulesRenderer> component can be combined with other module-related components, such as <ModuleConfigureWidget> or <EventsWidget>, to build more complex module rendering and interaction experiences.