Message 消息提示

介绍

在页面顶部展示消息提示，支持函数调用和组件调用两种方式。

引入

"usingComponents": {
	"m-message": "mind-ui-weapp/message/index"
}

示例

基础用法

<m-button bind:click="showMessage">默认提示</m-button>

<m-message id="message" />

注意：小程序中 import 文件无法使用相对路径，只可以使用绝对路径，以当前文件所在路径向上查找。
推荐使用以下方式挂载在 wx 全局上使用，页面中无需再次引入 js，详情请看 安装 目录介绍。

// 此处应为相对地址
import Message from 'mind-ui-weapp/message/message'
Page({
	showMessage() {
		Message('这是一条默认提示')
	}
})

通知类型

通知支持 primary、success、warning、error 四种类型，默认为 primary。

<m-button bind:click="showWarningMessage">警告提示</m-button>

<m-message id="message" />

import Message from 'mind-ui-weapp/message/message'

Page({
	showWarningMessage() {
		Message.warning('这是一条警告提示')
	}
})

自定义通知

自定义消息通知展示时长。

<m-button bind:click="showDurationMessage">自定义提示时间</m-button>

<m-message id="message" />

import Message from 'mind-ui-weapp/message/message'

Page({
	showDurationMessage() {
		Message({
			content: '我将在 5 秒后消失',
			duration: 5000
		})
	}
})

Properties

参数	说明	类型	可选值	默认值
custom-class	自定义样式类名	String	—	—
content	提示内容	String	—	—
type	类型	String	primary success warning danger	primary
duration	持续时间，单位ms。设为 0 则不会自动关闭	Number	—	2000
showClose	是否显示关闭按钮	Boolean	—	false
close	关闭时的回调函数, 参数为被关闭的 message 实例	Function	—	—
zIndex	层级	Number	—	2000

Events

调用 Message 会返回当前 Message 的实例。如果需要手动关闭实例，可以调用它的 close 方法。

方法名称	说明
close	关闭当前 Message