vue中对element的弹框messagebox的二次封装

在vue中对确认框的二次封装
使用场景:在页面中做某些需要警告的操作时的弹框提示

1、在utils文件夹下新建一个confirm.js文件来对messageBox的封装,内容如下:
/** confirm.js */
import { MessageBox } from 'element-ui'

export function handleCofirm(text = '确定执行此操作吗?', type = 'warning') {
  return MessageBox.confirm(text, '提示', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: type,
    center: true
  })
}
2、使用
<script>
import { handleCofirm } from '@/utils/confirm'
export default {
  name: 'AppDomain',
  // 删除域名
    deleteDomain(row) {
      handleCofirm('确认删除该域名吗?', 'warning', 'success').then(res => {
         // do something
      }).catch(err => {
        console.log('err', err) // cancel
        // do something
      })
    }
  
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容