element ui中按需引入MessageBox,并注册到全局使用

文档解释— 单独引用

全局使用
$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,
	             });
	           }
	         });
	       },
	     });

你可能感兴趣的:(ui,vue.js,javascript)