Note

This documentation describes the ViewContainer Vue component for native UI views, for Xml templates see view-container.

ViewContainer

A single-frame view container. When no containerId is provided, displays the top-level page frame.

Import

import { ViewContainer } from '@neos/app'

Props

Prop	Type	Default	Description
`containerId`	`string`	`undefined`	Named container ID. When omitted, renders the top-level application frame
`protectUnsavedChanges`	`boolean`	`false`	Ask for confirmation (the same Closing/HasChanges check a tab close already triggers) before replacing the displayed view, instead of silently discarding unsaved changes. Defaults to false so existing usages keep their current behavior.

Usage Examples

Main application content area

<HorizontalLayout space="none" style="height: 100vh">
  <Sidebar :items="navItems" />
  <ViewContainer />
</HorizontalLayout>

Named sub-container

<SplitterPanel>
  <ViewContainer containerId="leftPanel" />
</SplitterPanel>
<SplitterPanel>
  <ViewContainer containerId="rightPanel" />
</SplitterPanel>

Table of Contents