ion-datetime-button
日期時間按鈕與 日期時間 元件連結，以顯示格式化的日期和時間。它也提供按鈕以在模式視窗、快顯視窗等中呈現日期時間。
概觀
當空間受限時，應使用日期時間按鈕。此元件會顯示按鈕，其中顯示目前的日期和時間值。當點擊按鈕時，日期或時間選擇器會在覆蓋層中開啟。
當使用 Angular、React 或 Vue 等 JavaScript 架構使用日期時間按鈕時，請務必使用 ion-modal 上的 keepContentsMounted 屬性 或 ion-popover 上的 keepContentsMounted 屬性。這允許即使覆蓋層尚未呈現，也可以掛載連結的日期時間執行個體。
基本用法
本地化
ion-datetime-button 上的本地化文字是由相關聯的 ion-datetime 執行個體上的 locale 屬性決定。請參閱 日期時間本地化 以取得更多詳細資訊。
格式選項
您可以在相關聯的日期時間執行個體上提供 formatOptions，以自訂日期時間按鈕中日期和時間的格式。請參閱 日期時間格式選項 以取得更多詳細資訊。
搭配模式視窗和快顯視窗使用
ion-datetime-button 必須與已掛載的 ion-datetime 執行個體相關聯。因此，必須使用將 keepContentsMounted 屬性設定為 true 的 內嵌模式視窗 和 內嵌快顯視窗。
屬性
color
| 描述 | 要從應用程式的色彩調色盤中使用的色彩。預設選項為："primary"、"secondary"、"tertiary"、"success"、"warning"、"danger"、"light"、"medium" 和 "dark"。如需有關色彩的詳細資訊，請參閱 佈景主題。 |
| 屬性 | color |
| 類型 | "danger" ｜ "dark" ｜ "light" ｜ "medium" ｜ "primary" ｜ "secondary" ｜ "success" ｜ "tertiary" ｜ "warning" ｜ string ｜ undefined |
| 預設值 | 'primary' |
datetime
| 描述 | 與日期時間按鈕相關聯的 ion-datetime 執行個體的 ID。 |
| 屬性 | datetime |
| 類型 | string ｜ undefined |
| 預設值 | undefined |
disabled
| 描述 | 如果為 true，則使用者無法與按鈕互動。 |
| 屬性 | disabled |
| 類型 | boolean |
| 預設值 | false |
mode
| 描述 | 模式決定要使用的平台樣式。 |
| 屬性 | mode |
| 類型 | "ios" ｜ "md" |
| 預設值 | undefined |
事件
此元件沒有可用的事件。
方法
此元件沒有可用的公用方法。
CSS 陰影部分
| 名稱 | 描述 |
|---|---|
native | 包裝已插槽文字的原生 HTML 按鈕。 |
CSS 自訂屬性
此元件沒有可用的 CSS 自訂屬性。
插槽
| 名稱 | 描述 |
|---|---|
date-target | 顯示在日期按鈕內的內容。 |
time-target | 顯示在時間按鈕內的內容。 |