SusSnackbar

短暂提示 toast —— 文本、超时、位置，可选操作按钮。

包

SusKit · 原子（商业）

在 Playground 中打开

SusKit · Atoms

属性

名称	类型	默认值
Text	Prop<string>	""	v-model
Variant	Prop<string>	"info"	v-model
Timeout	Prop<int>	5000	v-model
Location	Prop<string>	"bottom-center"	v-model
CloseOnContentClick	Prop<bool>	false	v-model
Vertical	Prop<bool>	false	v-model
MultiLine	Prop<bool>	false	v-model
ShowTimer	Prop<bool>	false	v-model
CloseLabel	Prop<string>	"OK"	v-model
Overlay	Prop<bool>	false	v-model

插槽

名称
（默认）
actions

事件

名称	字段	载荷
Close	OnClose	—

样式钩子

USS 类契约 — 无需改 C# 即可覆盖外观。状态通过这些类切换：

• sus-slot
• sus-snackbar
• sus-snackbar__actions
• sus-snackbar__body
• sus-snackbar__close-btn
• sus-snackbar__main
• sus-snackbar__text
• sus-snackbar__timer
• sus-snackbar--bottom
• sus-snackbar--center
• sus-snackbar--error
• sus-snackbar--info
• sus-snackbar--left
• sus-snackbar--multi-line
• sus-snackbar--overlay
• sus-snackbar--right
• sus-snackbar--success
• sus-snackbar--top
• sus-snackbar--vertical
• sus-snackbar--warning
• sus-snackbar--with-timer
• unity-label
• unity-text-element

用法

<template>
  <sus:SusSnackbar Text="Saved"
                   Variant="success"
                   Timeout="4000"
                   Location="bottom-center"
                   CloseLabel="OK"
                   @close="OnClosed" />
</template>

<script>
void OnClosed() { /* … */ }
</script>

var toast = new SusSnackbar();
toast.Text.Value = "Connection lost";
toast.Variant.Value = "error";
toast.Timeout.Value = 5000;
toast.ShowTimer.Value = true;
toast.OnClose += () => { /* … */ };

变体

info · success · warning · error

备注

• 插槽 actions 用于自定义按钮；默认关闭按钮使用 CloseLabel。
• 需要堆叠多个 toast 时，优先使用队列 molecule（SusSnackbarQueue）。