目标:
想要在MessageBox中的文本中写一些事件,如何处理
在vue中进行操作:
coding
// 弹窗提示
this.$confirm({
customClass: "add-fail",
title: this.$t('add_error'),
type: 'error',
dangerouslyUseHTMLString: true, // 将消息使用html渲染
message: `<p>${this.$t('fail')}<span οnclick='routerJump()'>${this.$t('readd')}</span></p>`,
buttons: [{ name: this.$t('close'), action: 'cancel' }]
});
mounted () {
window.routerJump = this.routerJump; // 确保在模版上的事件可以执行
},
beforeDestroy() {
delete window.routerJump;
},
methods: {
routerJump() {
// 获取 messageBox DOM 后移除,清除上次的(只是被隐藏并未被销毁)
let el_message_box = document.querySelector('.el-message-box__wrapper');
let v_modal = document.querySelector('.v-modal');
if (el_message_box && v_modal) {
el_message_box.parentNode.removeChild(el_message_box);
v_modal.parentNode.removeChild(v_modal);
}
MessageBox.close();
router({
name: 'record',
params: {pageType: 'add', serverType: 1}
});
}
}