@capacitor/action-sheet

操作表 API 提供對原生操作表的存取，這些操作表會從螢幕底部彈出，並顯示使用者可以採取的動作。

安裝

npm install @capacitor/action-sheet
npx cap sync

變數

此外掛程式將使用下列專案變數（定義於您應用程式的 variables.gradle 檔案中）

• androidxMaterialVersion：com.google.android.material:material 的版本 (預設值：1.10.0)

PWA 筆記

操作表外掛程式需要 PWA 元素 才能運作。

範例

import { ActionSheet, ActionSheetButtonStyle } from '@capacitor/action-sheet';

const showActions = async () => {
  const result = await ActionSheet.showActions({
    title: 'Photo Options',
    message: 'Select an option to perform',
    options: [
      {
        title: 'Upload',
      },
      {
        title: 'Share',
      },
      {
        title: 'Remove',
        style: ActionSheetButtonStyle.Destructive,
      },
    ],
  });

  console.log('Action Sheet result:', result);
};

API

• showActions(...)
• 介面
• 列舉

showActions(...)

showActions(options: ShowActionsOptions) => Promise<ShowActionsResult>

顯示一個具有各種選項的操作表樣式模組，供使用者選擇。

參數	類型
options	ShowActionsOptions

返回： Promise<ShowActionsResult>

自 1.0.0

---

介面

ShowActionsResult

屬性	類型	描述	自
index	number	點擊的選項索引（從零開始）	1.0.0

ShowActionsOptions

屬性	類型	描述	自
title	string	操作表的標題。	1.0.0
message	string	在標題下方顯示的訊息。此選項僅在 iOS 上受支援。	1.0.0
options	ActionSheetButton[]	使用者可以選擇的選項。	1.0.0

ActionSheetButton

屬性	類型	描述	自
title	string	選項的標題	1.0.0
style	ActionSheetButtonStyle	選項的樣式。此選項僅在 iOS 上受支援。	1.0.0
icon	string	選項的圖示 (ionicon 命名慣例)。此選項僅在 Web 上受支援。	1.0.0

列舉

ActionSheetButtonStyle

成員	值	描述	自
預設	'DEFAULT'	選項的預設樣式。	1.0.0
Destructive	'DESTRUCTIVE'	在破壞性選項上使用的樣式。	1.0.0
Cancel	'CANCEL'	在取消操作表的選項上使用的樣式。如果使用，應在最新的可用選項上。	1.0.0