在vue项目的main.js中使用element-ui中的Message 消息提示、MessageBox 弹框、Notification 通知等
在vue项目中的main.js中直接使用element-ui中的Message 消息提示、MessageBox 弹框、Notification 通知和在vue文件中使用不同,是因为你在vue中可以从this.maeeage调用,但是在main.js中会提示你:undefined一般是使用axios拦截器的时候会用到://引用import Vue from 'vue';import ElementU
·
在vue项目中的main.js中直接使用element-ui中的Message 消息提示、MessageBox 弹框、Notification 通知
和在vue文件中使用不同,是因为你在vue中可以从this.maeeage
调用,但是在main.js
中会提示你:
undefined
一般是使用axios拦截器的时候会用到:
//引用
import Vue from 'vue';
import ElementUI from 'element-ui';
// 添加拦截器
axios.interceptors.response.use(function (response) {
// 处理响应数据
// console.log('对响应数据做点什么')
return response;
}, function (error) {
// 对响应错误做点什么
console.log(ElementUI)
//Message 消息提示
ElementUI.Message({
message: '恭喜你,这是一条成功消息',
type: 'success'
});
//Notification 通知
ElementUI.Notification({
title: '警告',
message: '这是一条警告的提示消息',
type: 'warning'
});
//MessageBox 弹框
ElementUI.MessageBox({
title: '标题名称',
message: '这是提示文案这是提示文案这是提示文案这是提示文案这是提示文案这是提示文案这是提示文案这是提示文案'
});
return Promise.reject(error);
});
使用的时候直接
前面加上ElementUI
ElementUI.Message({
message: '恭喜你,这是一条成功消息',
type: 'success'
});
拦截器例子,每次请求之前:用来验证token是否还有效
axios.interceptors.response.use(response => {
let count = 0
// console.log("++++++++打印看看+++++++++",response)
// console.log("+++++++++++++++++",response.data.code)
if (response.data.code == 403) {
// alert("当前登录已失效")
ElementUI.Message({
message: '当前登录已失效,请重新登录',
type: 'error'
});
router.replace({ path: '/login' })
}
return response;
}, error => {
return Promise.reject(error.response.data) //返回接口返回的错误信息
})
更多推荐
已为社区贡献18条内容
所有评论(0)