Monday, May 27, 2024

Vue 3 Sweetalert2 Popup Working Example

Vue 3 Sweetalert2 Popup Working Example

Hello guy’s welcome back to my blog. Today in this blog post, I am going to tell you, Vue 3 Sweetalert2 Popup Working Example.

Vue Sweetalert2 Working Demo

Guy’s Vue 3 came and if you are new in Vue3 then please check the below link:

  1. Vue 3 Tutorials
Vue 3 Sweetalert2 Popup Working Example
Vue 3 Sweetalert2 Popup Working Example

Friends now I proceed onwards and here is the working code snippet and please use this carefully to avoid the mistakes:

1. Firstly friends we need fresh vuejs(Vue 3) setup and for that we need to run below commands into our terminal and also w should have latest node version installed on our system.

Also guy’s in this I am installing  sweetalert2 popup for beautiful success messages:

npm install -g @vue/cli

vue create vuedemo

cd vuedemo

npm install -S vue-sweetalert2

npm run serve //http://localhost:8080/

2. Finally guys we need to add below code into our src/App.vue file to get final output on web browser:


       <a v-on:click="doSomething">Click</a>


import Swal from 'sweetalert2'
export default {
            title: 'OPPS',
            text:   "wow",
            icon: 'warning',

Guy’s now we are done and if you have any kind of query then please comment below.



the authortherichpost
Hello to all. Welcome to Myself Ajay Malhotra and I am freelance full stack developer. I love coding. I know WordPress, Core php, Angularjs, Angular 14, Angular 15, Angular 16, Angular 17, Bootstrap 5, Nodejs, Laravel, Codeigniter, Shopify, Squarespace, jQuery, Google Map Api, Vuejs, Reactjs, Big commerce etc.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.