vue2弹窗确认框vue-sweetalert2插件的使用

安装

yarn add vue-sweetalert2

// or 
npm install vue-sweetalert2

使用方法

在main.js中注册

import VueSweetalert2 from 'vue-sweetalert2'

// 引入提示框
Vue.use(VueSweetalert2)

在具体页面使用

this.$swal({
  title: '删除用户',
  text: `是否确认删除用户：${data.userName}(${data.userId})？`,
  icon: 'warning',
  reverseButtons: true,
  showCancelButton: true,
  confirmButtonText: '确认',
  cancelButtonText: '取消',
  customClass: {
    confirmButton: 'sweet-btn-primary',
  },
}).then(async result => {
  if (result.isConfirmed) {
    const params = {
      id: data.userId,
    }
    const res = await delUser(params)
    if (res.code === 200) {
      this.$notify.info('success', res.msg)
      this.query.pageNum = 1
      this.$_getTableData()
    }
  } else {
    this.$notify.info('warning', `已取消删除用户：${data.userName} (${data.userId})`)
  }
})

参考链接

https://www.npmjs.com/package/vue-sweetalert2