P170. 23.登录组件配置弹窗提示

在使用element-UI进行编程时，如何实现不同格式的弹框呢？

 

在入口文件中，需要引入弹框提示组件，引入的代码如下所示 

//导入弹框提示组件
import { Message } from 'element-ui'


//将弹框组件挂载到了Vue的原型对象上，这样的话，每一个组件都是可以通过this来访问到$message
//只要访问到$message就可以进行弹框提示了
Vue.prototype.$message = Message

在需要谈提示框的地方，所使用的方法

//在需要弹框的地方可以采用如下的方式进行使用

if(res.meta.status !==200) {
	console.log("登录失败！")   
	//这样可以访问到刚刚挂载的$message属性
	//这个$message属性提供了一系列弹框方法                    
	return this.$message.error('登录失败');
}
//this.$message.success表示弹一个正确的提示框
this.$message.success('登录成功'); 
console.log("登录成功！")