Notify 消息通知

Feedback · Display component

Page-top notifications.

On-demand importwbbb-ui/components/notify

Basic Usage

Example code

<script setup lang="ts">
import { showNotify } from 'wbbb-ui/services/notify'

function open() { showNotify('Saved successfully') }
</script>

<template><button @click="open">Open Notify</button></template>

Live mobile previewOpen in a new tab ↗

States and Interaction

All listed states can be operated and verified in the live Playground preview.

DefaultPrimarySuccessWarningDangerInfo

Service components use <wbbb-overlay-host /> for library visuals and fall back to uni-app native capability without a host.

API Reference

Props

Property	Description	Type	Default	Required
duration	Sets the display or animation duration in milliseconds.	number	2200	No
message	Provides the notification or feedback message.	string	''	No
modelValue	Provides the current value used by v-model.	boolean	false	No
type	Sets the semantic type or variant of the component.	Exclude<WbbbType, 'default'>	'info'	No
zIndex	Sets the stacking order of the component.	number	1000	No

Events

• update:modelValue
• close

Slots

• default

Two-way binding

Supports v-model (modelValue).

Platform Notes

Build verification: H5, App Vue, WeChat Mini Program, Alipay Mini Program, and Douyin Mini Program.

Runtime differences: H5 supports keyboard focus and reduced motion. Mini Programs provide equivalent touch interaction; verify upload, date selection, and overlays on target platforms.

Usage note: Service APIs can be used without full installation and are queued by Overlay Host.