blazor-devexpress-dot-blazor-dot-dxaccordionitem-178a8dff.md
Specifies the template used to display the Accordion item.
Namespace : DevExpress.Blazor
Assembly : DevExpress.Blazor.v25.2.dll
NuGet Package : DevExpress.Blazor
[Parameter]
public RenderFragment<IAccordionItemInfo> Template { get; set; }
| Type | Description |
|---|---|
| RenderFragment<IAccordionItemInfo> |
The item template.
|
This property overrides the DxAccordion.ItemTemplate property value.
The following example creates nested items of the Shapes item:
<DxAccordion>
<Items>
<DxAccordionItem Text="Shapes">
<Items>
<DxAccordionItem>
<Template>
<div class="shape-container">
<div class="shape circle"></div>
Circle
</div>
<div class="shape-container">
<div class="shape"></div>
Square
</div>
</Template>
</DxAccordionItem>
</Items>
</DxAccordionItem>
<DxAccordionItem Text="Templates" />
</Items>
</DxAccordion>
.circle {
border-radius: 50%;
}
.shape {
height: 1.5em;
width: 1.5em;
border: 2px solid orange;
background-color: orange;
margin-right: 8px;
display: inline-block;
}
.shape-container {
display: flex;
margin: 8px;
}
If you want to specify custom item content or header, use the ContentTemplate or HeaderTextTemplate properties.
If you want to specify the template for all items, use the ItemTemplate.
See Also