A staple as a navigation element in many modern applications, the Kendo UI for Vue Drawer offers a side navigation element that can be toggled to be displayed or hidden, often with a hamburger menu. Each menu item can be represented as an image and text combination, just text, just an image.
By default, the Vue Drawer initially displays with its menu collapsed. You can change that to initially display expanded or permanently display expanded.
The Vue Drawer offers several display modes, allowing developers to customize how the component behaves. You can choose to overlay the Angular Drawer content on top of existing content, push the content over as the Angular Drawer expands.
Mini Mode is a semi-collapsed state in which the Vue Drawer only shows the top-level item icons. When collapsing, you can choose to show this view or completely collapse.
With a single property, the Vue Drawer component can be rendered on either the left-hand side or right-hand side of the current page.
Since the Drawer is a Vue component, it supports any Vue router library, so you don’t have to spend unnecessary time on routing.
As with all components in Kendo UI for Vue, the Drawer supports custom rendering of menu items. This allows you to customize the appearance of individual items, but also allows you to show hierarchy.