elementui notify
使用 ElementUI 的 Notify 通知组件
ElementUI 提供了 Notify 通知组件，用于在页面顶部显示全局通知消息。以下是使用方法和常见配置。
基本用法
通过 this.$notify 调用通知组件，支持传递配置对象：
this.$notify({
title: '提示',
message: '这是一条通知消息',
type: 'success'
});通知类型
Notify 支持四种类型，通过 type 属性设置：
success：成功通知warning：警告通知info：信息通知error：错误通知
this.$notify({
title: '成功',
message: '操作成功完成',
type: 'success'
});自定义位置
通过 position 属性可以设置通知显示的位置，默认为 top-right，可选值包括：
top-righttop-leftbottom-rightbottom-left
this.$notify({
title: '提示',
message: '自定义位置的通知',
position: 'bottom-left'
});设置持续时间
使用 duration 属性控制通知自动关闭的时间（毫秒），默认值为 4500。设置为 0 时不会自动关闭。
this.$notify({
title: '提示',
message: '5秒后关闭的通知',
duration: 5000
});自定义关闭按钮
通过 showClose 属性控制是否显示关闭按钮，默认为 true。
this.$notify({
title: '提示',
message: '没有关闭按钮的通知',
showClose: false
});使用 HTML 内容
设置 dangerouslyUseHTMLString 为 true 可以在 message 中使用 HTML 内容。
this.$notify({
title: 'HTML 内容',
message: '<strong>这是加粗的</strong> <i>斜体文本</i>',
dangerouslyUseHTMLString: true
});全局配置
可以在引入 ElementUI 时全局配置 Notify 的默认行为：
import Vue from 'vue';
import ElementUI from 'element-ui';
Vue.use(ElementUI, {
notify: {
position: 'bottom-right',
duration: 3000
}
});手动关闭通知
Notify 返回一个关闭函数，可以手动关闭通知：
const notifyInstance = this.$notify({
title: '提示',
message: '可以手动关闭的通知',
duration: 0
});
// 3秒后手动关闭
setTimeout(() => {
notifyInstance.close();
}, 3000);完整配置选项
Notify 支持的完整配置选项包括：
title：标题message：消息内容type：类型duration：显示时间position：位置showClose：是否显示关闭按钮onClose：关闭时的回调函数offset：偏移距离customClass：自定义类名
this.$notify({
title: '完整配置',
message: '包含所有配置选项的通知',
type: 'warning',
duration: 5000,
position: 'top-left',
showClose: true,
onClose: function() {
console.log('通知已关闭');
},
offset: 50,
customClass: 'my-notify'
});单独引入 Notify
如果只需要使用 Notify 组件，可以单独引入：
import { Notification } from 'element-ui';
Notification.success({
title: '成功',
message: '单独引入的通知'
});以上是 ElementUI Notify 组件的详细使用方法，根据实际需求选择合适的配置即可。
