虽说实现下面的效果,用el–dialog很轻松就能搞定。但是这种简单的交互,我更喜欢使用MessageBox。
话不多说,直接上代码~
<el-button type="primary" size="mini" @click="handleApply()" >处理申请</el-button>
handleApply() {
const h = this.$createElement;
let _this = this;
_this.statu = '1';
if (document.getElementById('radio1')) {
// 默认按钮选中同意,否则下次打开对话框按钮值为上次选中的值
document.getElementById('radio1').checked = true;
}
this.$msgbox({
title: '提示',
message:
h('div', null, [
h('span', null, '是否同意撤回申请: '),
h('span', {
style: {
marginRight: '20px'
}
},
[h('input', {
style: {
cursor: 'pointer',
},
attrs: {
// 添加属性
type: "radio",
name: "Radio",
value: "1",
id: "radio1",
checked: _this.statu === '1',
},
on: {
change: () => {
_this.statu = '1'
}
}
}, []), h('span', {
class: 'el-radio__label',
}, `同意`)]),
h('span', null,
[h('input', {
style: {
cursor: 'pointer',
},
attrs: {
type: "radio",
name: "Radio",
value: "0",
id: "radio2",
checked: _this.statu === '0',
},
on: {
change: () => {
_this.statu = '0'
}
}
}, []), h('span', { class: 'el-radio__label' }, `不同意`)]),
]),
showCancelButton: true,
confirmButtonText: '确定',
cancelButtonText: '取消',
}).then(action => {
axios.$post(
`/xxx/xxxxx/${_this.statu}`
).then((res) => {
if (res.success) {
this.$message.success("操作成功");
}
});
})
},
if (document.getElementById('radio1')) {
// 默认按钮选中同意,否则下次打开对话框按钮值为上次选中的值
document.getElementById('radio1').checked = true;
}
可能实现的不够完美,欢迎指正与补充。
原文地址:https://blog.csdn.net/m0_48276047/article/details/134335254
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:http://www.7code.cn/show_43468.html
如若内容造成侵权/违法违规/事实不符,请联系代码007邮箱:suwngjj01@126.com进行投诉反馈,一经查实,立即删除!
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。