Snackbar

The v-snackbar component is used to display a quick message to a user. Snackbars support positioning, removal delay and callbacks.

Usage

The standard snackbar is useful for calling attention to some function that has just happened.

API

v-snackbar
Name
absolute
Default
false
Type
boolean

Components.Snackbars.

Name
auto-height
Default
false
Type
boolean

Components.Snackbars.

Name
bottom
Default
false
Type
boolean

Components.Snackbars.

Name
color
Default
undefined
Type
string

コンポーネントに色を設定します。この色は、定義されている色の名前(例えばsuccesspurple)や、CSSの色指定(#033rgba(255, 0, 0, 0.5))を設定できます。

Name
left
Default
false
Type
boolean

Components.Snackbars.

Name
multi-line
Default
false
Type
boolean

Components.Snackbars.

Name
right
Default
false
Type
boolean

Components.Snackbars.

Name
timeout
Default
6000
Type
number

Components.Snackbars.

Name
top
Default
false
Type
boolean

Components.Snackbars.

Name
value
Default
undefined
Type
any

Components.Snackbars.

Name
vertical
Default
false
Type
boolean

Components.Snackbars.

Examples

Contextual

You can also apply a color to the snackbar to better fit your implementation.

Edit this page | language on Github
Vuetify 3 is now available!The latest version of Vuetify is now available!
Learn about Vuetify 3's new features and functionality for modern Vue applications
Start exploringExplore