mp-message 消息弹窗

支持通过 useMessage 和 props 两种方式调用显示

代码演示

通过 hooks 方法控制显示

我们强烈建议使用 hooks 方法来控制组件的显示状态，而 mp-message 组件仅用作一个挂载组件。

基本使用：

<script setup>
import {useMessage} from '@ifanrx/uni-mp'

const {showMessage} = useMessage()

showMessage('这是一条提示')
</script>

<template>
  <!-- 配合挂载 mp-message 组件 -->
  <mp-message ref="$message" />
</template>

详细使用方法见：弹窗控制 Hooks

通过 props 控制显示

当然现有 hooks 不满足使用，你也可以通过传入 props 来控制显示，以适配更多场景：

<template>
  <mp-message :visible="true" message="消息内容" />
</template>

API

Props

Prop name	Description	Type	Values	Default
visible v-model	显示弹窗	boolean	-
duration	显示时长	number	-	2000
text	提示文本	string	-	''
type	提示类型	string	-	'success'

Expose

setOptions

(options: object) => void

更新 message 选项

open

() => void

显示 message

close

() => void

隐藏 message

源码

组件 • 示例