background

Kendo UI for Vue

Vue DropDownButton

  • Provide a consistent, modern UX with this common element that allows the user to choose from a list of actions.
  • Part of the Kendo UI for Vue library along with 100+ professionally-designed components.
  • Includes support, documentation, demos, virtual classrooms, learning resources and more!
DropDownButton component being used to open a settings menu
  • Overview

    The Vue DropDownButton is a modern UI element that renders a popup list of action items. This versatile component supports icons, images, data binding, and customization.

    See the Vue DropDownButton demo

    vue-dropdownbutton-component-overview
  • Disabled DropDownButton

    It is very easy to render a non-active DropDownButton. It is just a matter of setting a property.

    See the Vue Disabled DropDownButton demo

    vue-disabled-dropdownbutton-component
  • Icon DropDownButton

    Each item in the Vue DropDownButton can be rendered as just text, text along with an icon, or just as an icon. These icons can be added from the list of Kendo UI for Vue icons, as a custom image or imported from third-party font icon libraries like FontAwesome

    See the Vue Icon DropDownButton demo

    vue-icon-dropdownbutton-component
  • Data Binding

    Much like the rest of the components in Kendo UI for Vue, you have many choices for data binding. Declare your items manually, bind to an array of objects, or bind to an array of strings.

    See the Vue DropDownButton Data Binding demo

  • Customization

    Enjoy complete control by customizing the appearance and behavior of the popup that appears when a user clicks the dropdown button.

    See the Vue DropDownButton Customization demo

  • Keyboard Navigation

    Built-in support for keyboard only navigation gives your users and alternative to the mouse as the primary means of interaction.

    See the Vue DropDownButton Keyboard Navigation demo

  • Accessibility

    The Vue DropDownButton helps you create apps for everybody. Full accessibility, AAA and WCAG 2.0 rating, and Section 508 and WAI-ARIA standards are baked in.

    Read the Vue DropDownButton Accessibility documentation

     

    Accessibility
Next Steps

Get Started with Kendo UI for Vue

Kendo UI for Vue - Kendoka