小编这次要给大家分享的是element中如何使用$confirm,文章内容丰富,感兴趣的小伙伴可以来了解一下,希望大家阅读完这篇文章之后能够有所收获。
可以诸如此类的封装一下
/*
* 公用提示窗
* @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的文章,如果觉得文章内容写得不错的话,可以把它分享出去给更多人看到。
亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。