Skip to main content
All docs
V24.1

DxDrawer.TargetContent Property

Specifies the drawer’s target content.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[Parameter]
public RenderFragment TargetContent { get; set; }

Property Value

Type Description
RenderFragment

The content of the header template.

Remarks

The DxDrawer component consists of drawer panel and target content area.

Drawer layout

Use the TargetContent property to specify the content displayed in the target content area.

Run Demo: Drawer Overview

<DxDrawer IsOpen="IsNavigationOpen" PanelWidth="20%">
    <BodyTemplate>
        <DxMenu Orientation="Orientation.Vertical">
            <Items>
                <DxMenuItem Text="Home" IconCssClass="menu-icon-home menu-icon" />
                <DxMenuItem Text="Components" IconCssClass="menu-icon-products menu-icon" />
                <DxMenuItem Text="Support" IconCssClass="menu-icon-support menu-icon" />
                <DxMenuItem Text="Contacts" IconCssClass="menu-icon-contacts menu-icon" />
                <DxMenuItem Text="About" IconCssClass="menu-icon-about menu-icon" />
            </Items>
        </DxMenu>
    </BodyTemplate>
    <TargetContent>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut 
        labore et dolore magna aliqua. Penatibus et magnis dis parturient. Eget dolor morbi non arcu risus. 
        Tristique magna sit amet purus gravida quis blandit. Auctor urna nunc id cursus metus aliquam 
        eleifend mi in. Tellus orci ac auctor augue mauris augue neque gravida. Nullam vehicula ipsum a arcu. 
        Nullam ac tortor vitae purus faucibus ornare suspendisse sed nisi. Cursus in hac habitasse platea 
        dictumst. Egestas dui id ornare arcu. Dictumst vestibulum rhoncus est pellentesque elit ullamcorper 
        dignissim.</p>
        <p>Mauris rhoncus aenean vel elit scelerisque mauris pellentesque pulvinar. Neque volutpat ac 
        tincidunt vitae semper quis lectus. Sed sed risus pretium quam vulputate dignissim suspendisse in. 
        Urna nec tincidunt praesent semper feugiat nibh sed pulvinar. Ultricies lacus sed turpis tincidunt 
        id aliquet risus feugiat. Amet cursus sit amet dictum sit amet justo donec enim. Vestibulum rhoncus 
        est pellentesque elit ullamcorper. Id aliquet risus feugiat in ante metus dictum at.</p>
    </TargetContent>
</DxDrawer>

Drawer terget content

See Also