Nuxt Sweet Alerts

Pro Component

Our Nuxt Sweet Alerts are beautiful, responsive, customisable, accessible replacements for Javascript’s popup boxes.
Keep reading our Nuxt Alerts examples and learn how to use this plugin.

Usage

If you want to replace the classic alert box with something that looks amazing, you can use the Sweet Alert 2 Plugin. We have changed the typography and colours for the plugin provided by Tristan Edwards. If you want to see the full documentation, please check out this page.

Initialization

// js import
import swal from 'sweetalert2'

// style import
import 'sweetalert2/dist/sweetalert2.css'

Example

<template>
   <button class="btn btn-default btn-fill" @click="showSwal">Try me!</button>
</template>

<script>
  import swal from 'sweetalert2';
  export default {
   methods: {
       showSwal () {
          swal({
           title: `Here's a message!`,
           buttonsStyling: false,
           confirmButtonClass: 'btn btn-success btn-fill'
         })
       }
     }
  }
</script>