Dropdown

Dropdown Component

The Dropdown component is a contextual overlay that displays a list of links and other elements. The Dropdown can be toggled.

Inheritance

Dropdown : BootstrapComponentBase

Related Components

The following components are typically used with a Dropdown component.

• DropdownDivider
• DropdownItem
• DropdownMenu
• DropdownToggleButton
• DropdownToggleLink

Examples

The sample below shows how to build a dropdown menu with a text toggle.

<Dropdown>
    <DropdownToggleLink>Toggle menu</DropdownToggleLink>

    <DropdownMenu>
        <DropdownItem Text="Active" IsActive="true" />
        <DropdownItem Text="Disabled" IsDisabled="true" />
        <DropdownItem Text="Normal" />
        <DropdownDivider />
        <DropdownItem Text="Item #1" OnClick="(e) => {
            // Your event handler code goes here.

        }" />
    </DropdownMenu>
</Dropdown>

The following sample shows how to use a button to toggle the dropdown menu.

<Dropdown>
    <DropdownToggleButton>Toggle</DropdownToggleButton>

    <DropdownMenu>
        <DropdownItem Text="Item #1" />
        
    </DropdownMenu>
</Dropdown>