Confirm #
A simple modal with message and ok and cancel buttons. Returns promise with true
if ok clicked and false
if cancel is clicked.
export default {
methods: {
onButtonClick() {
this.$vaModal.confirm('Are you sure you want to see standard alert?')
.then((ok) => ok && alert('This is standard browser alert'))
},
},
}
Props #
Any prop from VaModal can be passed to confirm. Event listeners can be passed with on
prefix. For example, onClickOutside
.
Name | Description | Types | Default |
---|---|---|---|
allow-body-scroll | Allows the document scroll while modal is open. |
|
|
anchor-class | Set class name to the |
| - |
aria-close-label | The aria-label of the close button |
|
|
attach-element | A valid selector of element, where modal will be rendered |
|
|
background-color | The background color of the modal dialog |
|
|
before-close | Function run before closing the modal |
| - |
blur | Use |
|
|
cancel-text | Text string to place in the default footer Cancel button |
|
|
disable-attachment | Ignore |
|
|
fixed-layout | Use |
|
|
fullscreen | Add the |
|
|
hide-default-actions | Use |
|
|
max-height | Use |
|
|
max-width | Use |
|
|
message | Content of modal body |
|
|
mobile-fullscreen | Use |
|
|
model-value | The value of the |
|
|
no-dismiss | Disable both close on overlay click and close on Esc |
|
|
no-esc-dismiss | Disable close on Esc |
|
|
no-outside-dismiss | Disable close on overlay click |
|
|
no-padding | Disable padding in the modal dialog |
|
|
ok-text | Text string to place in the default footer Ok button |
|
|
onBeforeClose | Function to be called before closing |
| |
onBeforeOpen | Function to be called before opening |
| |
onCancel | Function to be called after cancel button is been pressed |
| |
onClickOutside | Function to be called after clicking outside the modal |
| |
onClose | Function to be called after closing |
| |
onOk | Function to be called after pressing the "ok" button |
| |
onOpen | Functiong to be called after opening the modal |
| |
overlay | Use |
|
|
overlay-opacity | Set the overlay's opacity |
|
|
size | Set the size of the modal's width. |
|
|
title | Text content to place in the title |
|
|
without-transitions | Use |
|
|
z-index | Set the modal's |
| - |
Events #
Name | Description |
---|---|
before-close | Emits before modal's start closing after transition started |
before-open | Emits before modal's open after transition started |
cancel | Emits when the user closes the modal window without side effects |
click-outside | Emits when overlay is clicked |
close | Emits when modal's is closed and transition is complete |
ok | Emits when Ok button is clicked |
open | Emits when modal's is open and transition is complete |
update-model-value | The event is triggered when the component needs to change visibility |