<SceneConfigureWidget>

INFO

The <SceneConfigureWidget> component must be used within a <Provider> component.

The <SceneConfigureWidget> component is used to display and configure scene properties. With this component, users can view and adjust settings and parameters related to the scene.

Usage Example

Basic Version

In the basic version, you can directly use the <SceneConfigureWidget> component to display the scene configuration options without any extra customization:

<template>
    <SceneConfigureWidget></SceneConfigureWidget>
</template>

Custom Version

With the slot functionality, you can customize different parts of the content. For example, you can customize the header, group header, and the empty state message:

<template>
    <SceneConfigureWidget>
        <template #header="item">{{ item.label }}</template>
        <template #groupHeader="item">{{ item.label }}</template>
        <template #before="item"><span>1</span></template>
        <template #after="item"><span>2</span></template>
        <template #empty>No Data</template>
    </SceneConfigureWidget>
</template>

Slot Explanation

• #header: Customizes the header content of the scene configuration item. The item parameter is received, which is used to render the title of each configuration item.
• #groupHeader: Customizes the title of each configuration group.
• #before: Inserts custom content before each configuration item.
• #after: Inserts custom content after each configuration item.
• #empty: Displays a message when there are no configuration items.

Notes

• <Provider> component: The <SceneConfigureWidget> must be contained within a <Provider> component to ensure the correct context and functional support.
• Slot Customization: You can use slots to customize the rendering of each part, adapting to different usage needs.
• Data Format: The item parameter typically contains the label, value, or other properties for each configuration item. Ensure the data structure passed matches the component’s requirements.