element中的$confirm的使用


Posted in Javascript onApril 26, 2020

可以诸如此类的封装一下

/*
 * 公用提示窗
 * @export
 * @param {string}[desc="确认操作"]弹框提示文字
 * @param {string}[title="提示"]弹框标题
 * @param{string}[confirmButtonName ='确认']确认按钮文字
 * @param {string}[cancelButtonName="取消"] 取消按钮文字
 * @param{boolean}[distinguishCancelAndClose = false]关系和取消是否执行同一方法
 *@return
 *
 */
export function confirm (desc = '确认操作', title = '提示', confirmButtonName = '确认', cancelButtonName = '取消', distinguishCancelAndClose = false) {
 return this.$confirm(desc, title, {
  confirmButtonName: confirmButtonName,
  cancelButtonName: cancelButtonName,
  distinguishCancelAndClose: distinguishCancelAndClose,
  closeOnClickModel: false,
  type: 'warning',
  center: true
 })
}
xxx//vue
submitSome(){
  try(){
    async utils.confirm.call(this,"确认要删除吗")
    const formData = {
      'id':this.id
    }
    let res = await this.$post('/sss',formData)
    if(res.code===1){
     //do something
    }
  }catch(e){
   console.log(e)
   // 如果需要关闭和取消有所区别
   if(e==='close'){
    //do something
   }else if(e==='cancel'){
    //do something
   }
  }
}

this.$confirm确定框内容换行显示

// 把写的提示信心需要换行的地方分成数组 confirmText 
const confirmText = ['是否将此项移除?', '注意:移除后不可恢复。'] 
const newDatas = [] 
const h = this.$createElement 
for (const i in confirmText) { 
   newDatas.push(h('p', null, confirmText[i])) 
} 
 this.$confirm( 
   '提示', 
   { 
     title: '提示', 
     message: h('div', null, newDatas), 
     showCancelButton: true, 
     confirmButtonText: '确定', 
     cancelButtonText: '取消', 
     type: 'warning' 
   } ).then(() => { })

到此这篇关于element中的$confirm的使用的文章就介绍到这了,更多相关element $confirm 内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
纯js实现的论坛常用的运行代码的效果
Jul 15 Javascript
预加载css或javascript的js代码
Apr 23 Javascript
jquery随意添加移除html的实现代码
Jun 21 Javascript
封装好的一个万能检测表单的方法
Jan 21 Javascript
JavaScript使用yield模拟多线程的方法
Mar 19 Javascript
用JavaScript实现页面重定向功能的教程
Jun 04 Javascript
HTML页面定时跳转方法解析(2种任选)
Dec 22 Javascript
Javascript ES6中数据类型Symbol的使用详解
May 02 Javascript
详解浏览器缓存和webpack缓存配置
Jul 06 Javascript
Angular中sweetalert弹框的基本使用教程
Jul 22 Javascript
JS实现在线ps功能详解
Jul 31 Javascript
JavaScript onclick事件使用方法详解
May 15 Javascript
JavaScript监听一个DOM元素大小变化
Apr 26 #Javascript
分享一款超好用的JavaScript 打包压缩工具
Apr 26 #Javascript
微信小程序自定义navigationBar顶部导航栏适配所有机型(附完整案例)
Apr 26 #Javascript
javascript 使用sleep函数的常见方法详解
Apr 26 #Javascript
基于JavaScript实现十五拼图代码实例
Apr 26 #Javascript
小程序自定义导航栏兼容适配所有机型(附完整案例)
Apr 26 #Javascript
vue 使用 vue-pdf 实现pdf在线预览的示例代码
Apr 26 #Javascript
You might like
社区(php&&mysql)四
2006/10/09 PHP
摘自百度的图片轮换效果代码
2007/11/19 Javascript
在js中单选框和复选框获取值的方式
2009/11/06 Javascript
使用JQuery进行跨域请求
2010/01/25 Javascript
几个有趣的Javascript Hack
2010/07/24 Javascript
jquery 查找select ,并触发事件的实现代码
2011/03/30 Javascript
JS的Document属性和方法小结
2013/09/17 Javascript
js opener的使用详解
2014/01/11 Javascript
NodeJS中利用Promise来封装异步函数
2015/02/25 NodeJs
JS获取url参数、主域名的方法实例分析
2016/08/03 Javascript
AngularJS中过滤器的使用与自定义实例代码
2016/09/17 Javascript
Vue2.0设置全局样式(less/sass和css)
2017/11/18 Javascript
关于React动态加载路由处理的相关问题
2019/01/07 Javascript
重学 JS:为啥 await 不能用在 forEach 中详解
2019/04/15 Javascript
js 判断当前时间是否处于某个一个时间段内
2019/09/19 Javascript
Vue3.x源码调试的实现方法
2019/10/13 Javascript
使用webpack搭建pixi.js开发环境
2020/02/12 Javascript
[06:10]6.81新信使新套装!给你一个炫酷的DOTA2
2014/05/06 DOTA
跟老齐学Python之使用Python查询更新数据库
2014/11/25 Python
python搜索指定目录的方法
2015/04/29 Python
python模块之time模块(实例讲解)
2017/09/13 Python
python获取命令行输入参数列表的实例代码
2018/06/23 Python
Python学习笔记之读取文件、OS模块、异常处理、with as语法示例
2019/06/04 Python
python实现在函数图像上添加文字和标注的方法
2019/07/08 Python
tensorflow 报错unitialized value的解决方法
2020/02/06 Python
使用Pyhton 分析酒店针孔摄像头
2020/03/04 Python
OpenCV+python实现膨胀和腐蚀的示例
2020/12/21 Python
Steve Madden官网:美国鞋类品牌
2017/01/29 全球购物
孤独星球出版物:Lonely Planet Publications
2018/03/17 全球购物
Java中采用什么结构来捕获、处理异常?各子句的顺序、功能如何
2013/10/07 面试题
描述JSP和Servlet的区别、共同点、各自应用的范围
2012/10/02 面试题
运动会稿件300字
2014/02/14 职场文书
机电一体化专业求职信
2014/07/22 职场文书
长城英文导游词
2015/01/30 职场文书
沈阳故宫导游词
2015/01/31 职场文书
Python数据类型最全知识总结
2021/05/31 Python