Skip to content

Drawer

Panel that slides in from the screen side. Often used for forms or details.

Basic Usage

loading

Direction & Size

loading

Type

Customize header color via type:

loading

API

PropDescriptionType
modelValueWhether visibleboolean
titleTitlestring
typeHeader color type'default' | 'primary' | 'success' | 'warning' | 'danger' | 'info'
directionDirection'ltr' | 'rtl' | 'ttb' | 'btt'
sizeSize (width or height)string | number
modalWhether to show overlayboolean
closeOnClickModalClose on overlay clickboolean
showCloseShow close buttonboolean
withHeaderWhether to show headerboolean

Slots: default (content), header, footer.

Events: update:modelValue, open, close, opened.

MIT License