如何在 Vue CLI 中正确配置 SweetAlert

Question

这是我的配置和步骤。

1- 来自终端

npm install sweetalert2

2- 在 main.js 中

import Swal from 'sweetalert2'

window.swal = Swal;
Vue.use(Swal);
// Toast config
const toast = Swal.mixin({
  toast: true,
  position: 'top-end',
  showConfirmButton: false,
  timer: 3000,
  timerProgressBar: true,
  onOpen: (toast) => {
      toast.addEventListener('mouseenter', Swal.stopTimer)
      toast.addEventListener('mouseleave', Swal.resumeTimer)
  }
});
window.toast = toast;

3- 在视图中的使用

toast.fire({
    icon: 'success',
    title: 'Record has been updated.'
})

错误/问题：

237:5  error  'toast' is not defined  no-undef

Answer 1

用window.toast代替const toast。