- Notifications
You must be signed in to change notification settings - Fork4
A plugin dedicated for vue3 to show confirm dialog modal
License
malekim/v3confirm
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
A plugin dedicated for vue3 to show confirm dialog modal. Currently the plugin works only with composition api.
The plugin can be installed by npm or yarn.
npm install v3confirm --save
yarn add v3confirm
import{createApp}from'vue'importVueConfirmPluginfrom'v3confirm'importAppfrom'@/App.vue'constapp=createApp(App)app.use(VueConfirmPlugin,{root:'#confirm',yesText:'Yes',noText:'No',})app.mount('#app')
Remember to have a html handler somewhere with id provided in root option. For example in App.vue:
<template><divid="confirm"></div></template>
Then in component with composition api:
<template><button@click="deleteAllUsers"><button@click="deleteAllUsersWithAsync"></template><scriptlang="ts">import{defineComponent}from'vue'import{useConfirm}from'v3confirm'exportdefaultdefineComponent({setup:()=>{constconfirm=useConfirm()constdeleteAllUsers=()=>{confirm.show('Are you sure?').then((ok)=>{if(ok){alert('All users deleted')}else{alert('Users not deleted')}})}constdeleteAllUsersWithAsync=async()=>{constok=awaitconfirm.show('Are you sure?')if(ok){alert('All users deleted')}else{alert('Users not deleted')}}return{ deleteAllUsers, deleteAllUsersWithAsync,}},})</script>
Type: string
Default: none
An HTML element where confirm dialog is attached. It should be empty.
Type string
Default: 'yes'
A text used for confirm button.
Type string
Default: 'no'
A text used for decline button.
This project is using bulma.io styles. If your project is not using bulma, then you can style confirm for your own orimport bulma modal.
@import"bulma/sass/utilities/_all.sass"@import"bulma/sass/components/modal.sass"
About
A plugin dedicated for vue3 to show confirm dialog modal
Topics
Resources
License
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Packages0
Uh oh!
There was an error while loading.Please reload this page.
Contributors2
Uh oh!
There was an error while loading.Please reload this page.