文档解释— 单独引用
全局使用
$msgbox(options)
$alert(message, title, options) 或 $alert(message, options)
$confirm(message, title, options) 或 $confirm(message, options)
$prompt(message, title, options) 或 $prompt(message, options)
如果单独引入 MessageBox:
按需引入
import { MessageBox } from 'element-ui';
那么对应于上述四个全局方法的调用方法依次为:MessageBox(options), MessageBox.alert, MessageBox.confirm 和 MessageBox.prompt,调用参数与全局方法相同。
具体使用
import { MessageBox } from 'element-ui'; // 引入
Vue.component(MessageBox.name, MessageBox); // 全局注册组件, 若使用Vue.use()会再初始时候执行一次,有bug
Vue.prototype.$message = MessageBox; // 挂载到vm实例上
this.$message({type: 'success', message: '成功'}) // 模拟this.$msgbox
this.$message.alert("这是一个删除操作,确定删除吗?", "删除", { // 模拟this.$alert
confirmButtonText: "确定",
callback: () => {
DelStudentsList(row.id).then((res) => {
if (res.data.status === 200) {
this.getTableData();
this.$message({
type: "success",
message: res.data.message,
});
}
});
},
});