MujicaUI

Feedback · #096

EmptyState 浅色主题渲染快照
浅色 · 渲染快照
EmptyState 深色主题渲染快照
深色 · 渲染快照

096 EmptyState 空状态

用途

说明视图为何为空并给出下一步。区分“无数据”(集合本身为空)与“无搜索结果”(筛选没有匹配),两者使用不同的默认图标与文案。

最小示例

r := feedback.EmptyState(c, feedback.EmptyStateOptions{
	Kind:   feedback.EmptyNoResults,
	Query:  query,
	Action: "Clear search",
})
if r.Action {
	query = ""
}

签名:func EmptyState(c *ui.Context, opts EmptyStateOptions) EmptyStateResult

参数

字段类型默认值含义
KindEmptyKindEmptyNoDataEmptyNoData 或 EmptyNoResults。
Titlestring按类型的内置文案衬线标题。
Descriptionstring按类型的内置文案说明。
Querystring""仅 EmptyNoResults:默认说明写出该关键词。用于 EmptyNoData 时 panic。
Icon*ui.SVGinbox / search替换图标。
NoIconboolfalse不显示图标;与 Icon 同时设置时 panic。
Actionstring""次按钮文字。

状态

静态展示;操作按钮有悬停、按下与焦点状态。

事件

EmptyStateResult.Action:操作按钮被触发。

键盘操作

Tab 聚焦操作按钮;Enter 或 Space 触发。

限制

  • 只有一个操作;需要多个下一步时使用 Result。