Table

資料表格。欄位定義與資料分開傳，個別欄位要客製呈現時用 #cell-<key> slot。

基本表格

CommonTableBasic

components/Common/Table/Basic.vue

傳 columns 與 rows，欄位定義沿用 constants/tables.js 的 { label, key, align, width } 慣例。

窄螢幕時橫向捲動。捲動容器帶了 tabindex="0" 與 role="region" —— 只設 overflow-x-auto 的話，只用鍵盤的人是捲不動的。

caption 是表格的無障礙名稱，預設 sr-only，要顯示請加 show-caption。

含客製欄位

沒有資料

空的訂單列表
訂購日期	訂單編號	寄送方式	金額	操作
目前沒有訂單

名稱	型別	預設值	說明
`columns`*	Array<{ label, key, align?, width?, nowrap? }>	—	欄位定義，沿用 constants/tables.js 的慣例
`rows`	Array<Object>	[]	資料列
`caption`	String	''	表格的無障礙名稱，預設只給輔助技術讀
`showCaption`	Boolean	false	把 caption 顯示出來
`emptyText`	String	'目前沒有資料'	rows 為空時顯示
`stickyHead`	Boolean	false	表頭吸頂，表格本身可捲動時有用
`rowKey`	String \| Function	'id'	取得每列唯一 key 的欄位名或函式

* 為必填

Slot	Slot props	說明
`cell-<key>`	{ row, value, column, index }	客製單一欄的呈現，key 對應 columns 的 key