# Notice 通知提醒

# Notice 概述

在界面右上角显示可关闭的全局通知，常用于以下场景：

通知内容带有描述信息
系统主动推送

# Notice 代码示例

# 基础用法

基本用法，配置 duration 自动关闭的延时，默认在 4.5 秒后关闭，不关闭可以写 0。如果 desc 参数为空或不填，则自动应用仅标题模式下的样式。
建议标题言简意赅，例如"删除成功"，更详细的内容可以放在描述信息里。

# 提醒类型

带有状态图标的提醒。

info 带提醒状态图标的通知消息
success 带成功状态图标的通知消息
warring 带警告状态图标的通知消息
error 带错误状态图标的通知消息

# 自定义时长

自定义时长，为 0 则不自动关闭，关闭时触发 onclose 事件。也可以在 Notice.config() 中全局配置，详见API。

# 自定义显示位置(需初始化页面后点击才能看到效果)

在 Notice.config() 中通过 top 参数全局配置通知组件距离顶端的距离，不配置默认为 24px。 duration 参数全局配置通知消息自动关闭的时间，默认4.5s，配置为0时不自动关闭。
配置 onclose 触发通知关闭事件
配置 name 作为通知的唯一标示，全局方法 close(name) 关闭某个通知

# 自定义通知提醒

配置 render 属性自定义通知提醒。

# placement、top、bottom

用于设置notice提示信息弹出的位置

# 动态设置$hNotice.config()

# Notice API

# Notice instance

通过直接调用以下方法来使用组件：

this.$hNotice.open(config)
this.$hNotice.info(config)
this.$hNotice.success(config)
this.$hNotice.warning(config)
this.$hNotice.error(config)

以上方法隐式地创建及维护 Vue 组件。参数 config 为对象，具体说明如下：

属性	说明	类型	默认值
title	通知提醒的标题	String	-
desc	通知提醒的内容，为空或不填时，自动应用仅标题模式下的样式	String	-
duration	自动关闭的延时，单位秒，不关闭可以写 0	Number	4.5
name	当前通知的唯一标识	String	自动
onClose	关闭时的回调	Function	-
render	自定义通知提醒。返回一个 VNode 对象。函数第一个入参是 createElement 函数。配置以后 title 和 desc 将不起作用。(v1.0.44)	Function	-

另外提供了全局配置、全局关闭某个通知和全局销毁的方法：

this.$hNotice.config(options)
this.$hNotice.close(name)
this.$hNotice.destroy()

# $hNotice.config

重要说明

this.$hNotice.config(options)从v1.12.0版本开支持动态设置配置项，（之前只支持初始化的时候配置）
由于支持动态配置，this.$hNotice.config(options, immediate)方法，新增immediate参数，表示动态设置config在调用当前函数时是否就生效。默认：false v1.12.0
immediate: false（默认），表示动态设置config在调用当前函数时不立即生效，只有在再次创建notice弹窗信息时，才会生效
immediate: true，表示动态设置config在调用当前函数时立即生效
options中的duration属性，针对动态设置options配置，只有在新弹出的notice弹窗信息时有效，在动态设置之前弹出的notice弹框，针对该属性不会生效

this.$hNotice.config({
    top: 50,
    placement: 'top-right', // (默认值)
    duration: 3,
    zIndex: 800,
});

this.$hNotice.config({
    bottom: 50,
    placement: 'bottom-right',
    duration: 3,
    zIndex: 800,
});

# options参数说明

属性	说明	类型	默认值
placement	用于设置notice提示信息弹出的位置	String	top-right
bottom	通知组件距离底端的距离，单位像素注意：placement: 'bottom-right', 有效	Number	24
top	通知组件距离顶端的距离，单位像素注意：placement: 'top-right', 有效	Number	24
duration	默认自动关闭的延时，单位秒注意：针对动态设置options配置，只有在新弹出的notice弹窗信息时有效，在动态设置之前弹出的notice弹框，针对该属性不会生效	Number	4.5
zIndex	设置notice组件的层级z-index`v1.12.0`	Number	-