Element UI中MessageBox标准用法

第一步：在main.js文件中导入

import { MessageBox } from 'element-ui'Vue.prototype.$confirm = MessageBox.confirm

第二步：页面中使用

页面：

 <el-button type="danger" icon="el-icon-delete" size="mini" @click="showDeleteUserDialog(24)"></el-button>

对应的方法：

async showDeleteUserDialog (userId) { //删除用户const confirmRes = await this.$confirm('此操作将永久删除该用户, 是否继续?', '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning'}).catch(err => err) //用catch来捕获错误消息//用户单击确认，返回值为字符串confirm; 单击取消，返回值为字符串cancelif ('cancel' === confirmRes) {//用户点击了取消return this.$message.info('已经取消了删除')}if ('confirm' === confirmRes) { //用户点击了确认const { data: res } = await this.$axios.delete(`/user/deleteUserById/${userId}`)console.log(res)if (res.code !== 200) {return this.$message.error(res.msg)}this.$message.success(res.msg)//刷新用户列表this.page(this.queryInfo)}
}

Element UI中MessageBox标准用法相关推荐

Element ui 中的Upload用法
效果图: 代码: 转载于:https://www.cnblogs.com/cwzqianduan/p/8658460.html
[转载]C#中MessageBox.Show用法以及VB.NET中MsgBox用法
一.C#中MessageBox.Show用法 MessageBox.Show (String) 显示具有指定文本的消息框. 由 .NET Compact Framework 支持. MessageBo ...
Web前端笔记-element ui中table中某列添加a便签进行跳转
效果是这样的: 这里的文章标题和查看都可以进行跳转. 其中对应的代码如下: <template style="height: 100%"><el-table:da ...
Web前端笔记-修改element ui中表格样式（透明、去横纵线等含修改思路）
官方效果是这样的: 此处改成了这样的效果: 此处是可以进行滑动的,就是去除了滑动条,仍能滑动的效果. 下面说下修改样式,找到使用el-table的vue组建: 在style中贴上: <style ...
关于Element UI中select组件中遇到的问题
问题一:在使用select组件设置多选功能后,窗口抖动问题? 详细描述:在我使用select做多选的功能时出现了窗口抖动的问题,测试的时候发现,在有些人的电脑上抖动,有些人的电脑上不抖,找了很多文档, ...
关于Element UI中页面样式小问题
一,修改组件dialog窗口的大小二,在我使用upload组件上传一张美女图片时,发现当预览图片时,图片是灰色的,点击一下才会变亮,这种效果使我很不舒服,于是我通过添加下面的一条样式,问题解决了(可 ...
element ui 中 el-checkbox-group 点击一个全部选中的问题
element ui 中 el-checkbox-group 点击一个全部选中的问题原因是:checkbox-group中的v-modle要单独一个数组对象,不能作为表单对象,ruleForm中的一 ...
Element UI中Steps 步骤条description描述换行展示
突然要求加了个显示字段,之前的代码只能显示一行,于是乎找到了解决办法,代码如下:其中的属性自行到官网查看释义吧:Element UI官网传送门 <el-table><!-- 可展开的 ...
修改element ui中form表单的 label 颜色样式
此时,emement ui的form表单的label(年龄二字)是黑色的. 原代码: <template><el-form :model="numberValidateFo ...

Element UI中MessageBox标准用法

第一步：在main.js文件中导入

第二步：页面中使用

Element UI中MessageBox标准用法相关推荐

最新文章

热门文章