跳至主要内容
版本: v8

@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(options: ShowActionsOptions) => Promise<ShowActionsResult>

显示一个操作表样式的模态窗口,其中包含用户可以选择的不同选项。

参数类型
optionsShowActionsOptions

**返回:** Promise<ShowActionsResult>

1.0.0


接口

ShowActionsResult

属性类型描述
indexnumber单击选项的索引(从零开始)1.0.0

ShowActionsOptions

属性类型描述
titlestring操作表的标题。1.0.0
messagestring在标题下显示的消息。此选项仅在 iOS 上受支持。1.0.0
optionsActionSheetButton[]用户可以选择的操作。1.0.0

ActionSheetButton

属性类型描述
titlestring选项的标题1.0.0
styleActionSheetButtonStyle选项的样式。此选项仅在 iOS 上受支持。1.0.0
iconstring选项的图标(ionicon 命名约定)。此选项仅在 Web 上受支持。1.0.0

枚举

ActionSheetButtonStyle

成员描述
默认值'DEFAULT'选项的默认样式。1.0.0
Destructive'DESTRUCTIVE'用于破坏性选项的样式。1.0.0
Cancel'CANCEL'用于取消操作表的选项的样式。如果使用,应该在最新的可用选项上。1.0.0