vue2 确认框 MessageBox 弹框删除确认取消

最新推荐文章于 2024-07-25 14:45:39 发布

酷德钢琴家

最新推荐文章于 2024-07-25 14:45:39 发布

阅读量4.4k

点赞数 2

分类专栏： vue 前端文章标签： vue javascript elementui

本文链接：https://blog.csdn.net/weixin_40278278/article/details/118817166

版权

本文介绍如何在Vue2项目中快速实现删除操作的确认弹框，通过封装MessageBox函数并挂载到Vue原型，简化弹窗的使用，提高开发效率。详细步骤包括创建 MessageBox.js 文件、在 main.js 中引入以及在组件中调用。

摘要由CSDN通过智能技术生成

项目需要删除时弹出确认框需求是项目完成80%时提出的再添加弹出框的话耗时耗力所于是就有了封装好的弹窗函数挂载到Vue的原型上在项目里面可以直接 this. 调用显著提升摸鱼时间话不多说看代码

第一步 在 utils 创建一个名叫 MessageBox.js 的文件把代发复制进去
↓↓↓ 代码 ↓↓↓

/**
 *
 **********************
 * @MessageBox { true } : 引入element的弹出框
 * @confirmButtonText { true } : 确认按钮显示文字 ( 可更改 )
 * @cancelButtonText { true } : 取消按钮显示文字 ( 可更改 )
 * @外比巴卜 { false } : 确认返回 true , 取消返回 false , 方便进项下一步操作
 **********************
 *
 */

import {
    MessageBox } from "element-ui";
export const box