Empty 空狀態
空狀態時的佔位提示。
基礎用法
基礎用法
暫無資料
自訂描述文案
import { LhEmpty, LhButton } from '@lh-ui/react'
export default function Demo() {
return (
<LhEmpty
description="自定义描述文案"
actions={<LhButton type="primary">重新加载</LhButton>}
/>
)
}
Empty Props
| 屬性 | 說明 | 型別 | 可選值 | 預設值 |
|---|---|---|---|---|
| description | 描述文案(未傳取語言包 empty.description) | ReactNode | — | '暂无数据' |
| image | 自訂圖片 URL | string | — | — |
| actions | 動作區 | ReactNode | — | — |
| sx | 快速版面配置屬性 | SxProps | — | — |
自訂圖片
傳 image prop 或 children 節點都會走自訂圖容器(--custom 修飾符約束 max-width: 160px / max-height: 120px);都不傳時渲染內建水墨內嵌插畫(主題變數著色,明暗模式自適應)。
無障礙
根元素為 role="status"(溫和播報);預設插畫 aria-hidden,不干擾讀屏。
樣式
import '@lh-ui/react/style/empty'