イオニックアクションシート: 2026 年の完全ガイド

あなたは現在、2つの状況のいずれかでいるかもしれません。

アクションシートは単純に見えますが、インタラクションデザイン、フレームワークAPI、プラットフォームの動作、アクセシビリティ、リリース後のメンテナンスの交差点に位置しています。

イオニックアクションシートの紹介
- なぜチームがそれにたどり着くのか
APIとアクションシートコントローラーの理解
Angular、React、Vue用の実装例
CSSを使用したカスタマイズとスタイリング
高度なトピックとプラットフォームの考慮事項
- Webコンポーネントまたはネイティブプラグイン
- プラットフォームモードとアクセシビリティの詳細
トラブルシューティングの落とし穴とライブUI修正

イオニックアクションシートの導入

ユーザーが現在のコンテキストに関連付けられた小さな、集中した選択を必要とする場合、イオニックアクションシートは適切なツールです。ドロップダウンメニューを削除する。プロフィール写真を置き換える。ドキュメントを保存、共有、またはアーカイブする。これらのアクションは重要ですが、主なレイアウトに永久的なスペースを占める価値はありません。

In Ionicでは、パターンは長い間一貫してきた。 $ionicActionSheet Earlier Ionicアプリはサービスを使用していた show() サービスはTutorialsPointが説明しているように、画面の下部からスライドアップするパネルである。 ion-action-sheetサービスを注入し、コントローラーで呼び出すことで表示される。現代のアプリは.

が使用されているが、インタラクションモデルは依然として同じであるため、コンポーネントは一つの明確な例である。

Ionic 1のアクションシートドキュメントサマリーからTutorialsPoint

その連続性は実際のプロジェクトで役立つ。

コンポーネントは、毎回のリリースで変更されるトレンドの抽象化ではなく、安定したモバイルファーストパターンである。

iOSとAndroidのオプションメニューにマップし、Angular、React、Vueプロジェクトでも自然に感じられる。 なぜチームがそれにたどり着くのか
アクションシートは、ユーザーがすでにコンテキストを理解している場合に、コンパクトなリストの次のステップにのみ必要な場合に効果的である。確認に必要な最小限のオプションが必要な場合。
モーダルを使用します。 ユーザーがさらにコンテンツ、入力、またはスクロールが必要な場合。

実用的なルール: ボタンラベルが独自に立つことができない場合、追加の段落テキストが必要な場合、強制的にアクションシートにインタラクションを入れることは避けるべきです。

ハイブリッドアプリケーションでは、このパターンはウェブからネイティブへのモデルにうまく収まる。UIはウェブ層でレンダリングしやすく、タッチデバイスでネイティブに感じられるようになります。Capacitorで開発しているチームがウェブとネイティブの境界をより明確に理解したい場合は、__CAPGO_KEEP_1__がウェブとネイティブを繋ぐ方法の解説を参考にしてください。 how Capacitor bridges web and native code アクションシートコントローラーと__CAPGO_KEEP_0__

Understanding the Action Sheet Controller and API

アクションシートコントローラーのアーキテクチャ、設定、__CAPGO_KEEP_0__コンポーネントのフローチャート図。

APIはコントローラーによって動作する理由

APIは__CAPGO_KEEP_1__のアクションシートコントローラー

In Ionic の日常作業では、コントローラーベースのアプローチが通常、最も綺麗なオプションです。アクションシートは一時的なものなので、メニューがタップされた後に出現するため、ページに大きなテンプレートマークアップが残ることを避けたいのです。

公式の Ionic ドキュメントでは、アクションシートを "__CAPGO_KEEP_0__" と定義しています。 ユーザーが閉じる必要があるモーダルダイアログ 閉じるライフサイクルメソッド、たとえば "__CAPGO_KEEP_0__" のドキュメントに記載されているように、選択後のロジックを実行するために使用します。 onDidDismiss アクションシートの __CAPGO_KEEP_0__ ドキュメントアクションシートの API を構築する方法を示しています。最初に表示し、閉じた後は反応するようにしてください。タイミングに関する仮定に依存した批判的なロジックを組み込まないようにしてください。. That design tells you how to structure your code. Present first. React after dismissal. Don’t wire critical logic to assumptions about timing.

チームは、__CAPGO_KEEP_0__ の小さなサブセットしか必要としませんが、そのサブセットを正しく使用する必要があります。

Most teams only need a small subset of the API, but they need to use that subset correctly.

機能	重要性	__CAPGO_KEEP_0__
`header`	トップラベルを設定	アクションが曖昧な場合に適切です。
`subHeader`	追加テキストを表示	アクションが明確にされていない場合に役立つ
`buttons`	アクションの選択肢を定義します。	このページでは、動作と視覚的な強調が実現されます。
`cssClass`	カスタムクラスを追加します。	scoped stylingのためのscopedスタイリングの重要な機能はグローバルなハックではなく
`mode`	iOSまたはMDスタイリングを強制	プラットフォーム間で制御されたテストに役立つ

ボタン設定は、よく間違いが生じる場所です。一般的なボタンには以下のようなものがあります。

text visibleラベルに表示します。
icon 視覚的なヒントが必要な場合。
handler 即時のコールバックロジックのために。
role セマンティックな動作とプラットフォームのスタイリングのために。

role 装飾ではありません。使用する。 destructive 削除などの危険なアクションの場合。使用する。 cancel 危険なアクションは選択肢の端に置く。中立的なアクションと同じ視覚的重みを混ぜない。

解決は契約の一部です。

よくあるバグは、開発者がアクションシートを開き、ハンドラの結果が十分だと仮定し、オーバーレイが完全に解消される前にナビゲーションや状態の更新をトリガーすることです。その結果、不快なトランジション、古い状態、またはテストのレース条件が生じることがあります。

ライフサイクルを意図的に使用する:

シートを作成する。

返されたロールまたはデータを読む。
await present().
await onDidDismiss().
Read the returned role or data.
次のアクションをトリガーする。

あのパターンは面白くないが、それが機能する理由はそのためである。

Angularスタイルの例として、次の形を示す。

const sheet = await this.actionSheetController.create({
  header: 'Photo options',
  buttons: [
    {
      text: 'Take Photo',
      icon: 'camera',
      handler: () => {
        console.log('take photo');
      }
    },
    {
      text: 'Delete Photo',
      role: 'destructive',
      icon: 'trash'
    },
    {
      text: 'Cancel',
      role: 'cancel'
    }
  ]
});

await sheet.present();

const result = await sheet.onDidDismiss();
console.log('dismissed with role:', result.role);

CapgoのAPIの1つの重要な点を覚えておくなら、次のことを覚えておくこと。 イオニックアクションシートは、表示されたときに完了していない。完了するのは、閉じたときである。

Angular、React、Vueの実装例

フレームワークごとにシンタックスが異なるが、メンタルモデルは同じである。すべてのバージョンは同じインタラクションを作成する:ユーザーはアバターをタップし、プロフィール写真のオプションを表示し、1つのアクションを選択し、アプリはオーバーレイが閉じた後、応答する。

Angular、React、VueのモバイルアプリUI画面デザインの3つが表示される。画面はフードデリバリーのインターフェイスを表示している。

オフライン状態のメディアアップロードを扱っている場合、このガイドを参照してください。 Vue、Angular、Reactでオフライン画面を作成する方法写真アクションは、ネットワーク依存のフローに直接つながることが多いので、このガイドは、以下の例と組み合わせることがおすすめです。

Angularの例

In Ionic Angular, 最も一般的なアプローチはコンポーネントまたはページに __CAPGO_KEEP_0__ をインジェクトすることです。 ActionSheetController コンポーネントまたはページに __CAPGO_KEEP_0__ をインジェクトすることです。

import { Component } from '@angular/core';
import { ActionSheetController } from '@ionic/angular';

@Component({
  selector: 'app-profile-photo',
  template: `
    <ion-button expand="block" (click)="openPhotoActions()">
      Profile Photo Options
    </ion-button>
  `
})
export class ProfilePhotoComponent {
  constructor(private actionSheetController: ActionSheetController) {}

  async openPhotoActions() {
    const actionSheet = await this.actionSheetController.create({
      header: 'Profile photo',
      subHeader: 'Choose what to do next',
      buttons: [
        {
          text: 'Take Photo',
          icon: 'camera',
          handler: () => {
            console.log('Open camera flow');
          }
        },
        {
          text: 'Choose from Library',
          icon: 'images',
          handler: () => {
            console.log('Open photo library flow');
          }
        },
        {
          text: 'Remove Current Photo',
          role: 'destructive',
          icon: 'trash',
          handler: () => {
            console.log('Remove current photo');
          }
        },
        {
          text: 'Cancel',
          role: 'cancel'
        }
      ]
    });

    await actionSheet.present();

    const { role } = await actionSheet.onDidDismiss();
    console.log('Action sheet dismissed with role:', role);
  }
}

Angular チームは、通常、2 つの場所で間違いを犯します。ボタンハンドラーに論理を多く移動する、または UI トランジションを調整する安全な場所である __CAPGO_KEEP_0__ を忘れることです。

React の例

In Ionic React、 __CAPGO_KEEP_0__ はコンパクトで機能的な __CAPGO_KEEP_0__ で、自然にイベントハンドラーと組み合わせることができます。 useIonActionSheet React の API はエラゴニックですが、同じルールが適用されます。即時のハンドラーは選択されたアクションに焦点を当ててください。 API を使用してクリーンアップ、分析、またはフォローアップ UI ステートを実行してください。

import React from 'react';
import { IonButton, useIonActionSheet } from '@ionic/react';

const ProfilePhotoActions: React.FC = () => {
  const [presentActionSheet] = useIonActionSheet();

  const openPhotoActions = () => {
    presentActionSheet({
      header: 'Profile photo',
      subHeader: 'Choose what to do next',
      buttons: [
        {
          text: 'Take Photo',
          icon: 'camera',
          handler: () => {
            console.log('Open camera flow');
          }
        },
        {
          text: 'Choose from Library',
          icon: 'images',
          handler: () => {
            console.log('Open photo library flow');
          }
        },
        {
          text: 'Remove Current Photo',
          role: 'destructive',
          icon: 'trash',
          handler: () => {
            console.log('Remove current photo');
          }
        },
        {
          text: 'Cancel',
          role: 'cancel'
        }
      ],
      onDidDismiss: (event) => {
        console.log('Dismissed with role:', event.detail.role);
      }
    });
  };

  return (
    <IonButton expand="block" onClick={openPhotoActions}>
      Profile Photo Options
    </IonButton>
  );
};

export default ProfilePhotoActions;

React’s hook API is ergonomic, but the same rule applies. Keep the immediate handler focused on the chosen action. Use dismissal callbacks for cleanup, analytics, or follow-up UI state.

In Ionic Vue、 __CAPGO_KEEP_0 は組成 CAPGO_KEEP_0__ 内できれいに機能します。

Vue プロジェクトでは、副作用を保持する場所が実際に異なります。アプリがカメラまたはファイルピッカーロジックを使用している場合、ハンドラーからそれらを呼び出し、 __CAPGO_KEEP_0__ を薄くしてください。 actionSheetController フレームワーク固有の API を小さく保ちます。カメラ、アップロード、削除、分析のビジネスロジックは、行動シート設定とは別の場所に置いてください。

<template>
  <ion-button expand="block" @click="openPhotoActions">
    Profile Photo Options
  </ion-button>
</template>

<script setup lang="ts">
import { IonButton, actionSheetController } from '@ionic/vue';

const openPhotoActions = async () => {
  const actionSheet = await actionSheetController.create({
    header: 'Profile photo',
    subHeader: 'Choose what to do next',
    buttons: [
      {
        text: 'Take Photo',
        icon: 'camera',
        handler: () => {
          console.log('Open camera flow');
        }
      },
      {
        text: 'Choose from Library',
        icon: 'images',
        handler: () => {
          console.log('Open photo library flow');
        }
      },
      {
        text: 'Remove Current Photo',
        role: 'destructive',
        icon: 'trash',
        handler: () => {
          console.log('Remove current photo');
        }
      },
      {
        text: 'Cancel',
        role: 'cancel'
      }
    ]
  });

  await actionSheet.present();

  const result = await actionSheet.onDidDismiss();
  console.log('Dismissed with role:', result.role);
};
</script>

code

code

カスタマイズとスタイリング用のCSS

デフォルトのイオニックアクションシートのスタイリングはプロトタイプ用には十分ですが、ブランド化されたアプリ用では十分ではなく、デザインがより密なスペース、異なるフォント、破壊的なアクションをより明確に表示したい場合は十分ではありません。

Appleテーマのグラフィックデザインを使用した6つの異なるCSSカスタマイズとスタイリングのテクニックを示すウェブデザインプレゼンテーションスライド。

アプリがよりネイティブな製品に感じさせたい場合は、チームがアプリ全体が一般的なウェブラッパーに感じさせずにネイティブな製品に感じさせたい場合は、この記事のネイティブアプリの見た目のための基本的なJSとCSSの設定はアクションシートのスタイリングの有用な相談相手です。

cssClassからグローバルオーバーライドを始める

最初のスタイリングルールは簡単です。アプリ内のすべてのアクションシートをターゲットにする必要はありません。特定のバリアントをスコープするには cssClass を使用します。

const sheet = await actionSheetController.create({
  header: 'File actions',
  cssClass: 'file-actions-sheet',
  buttons: [
    { text: 'Rename' },
    { text: 'Delete', role: 'destructive' },
    { text: 'Cancel', role: 'cancel' }
  ]
});

そのバリアントだけをスタイルする:

.file-actions-sheet {
  --background: #101418;
  --color: #f5f7fa;
  --backdrop-opacity: 0.4;
}

そのアプローチは、後でセレクターを追跡するのではなく、よりスケーラブルです。

カスタムプロパティを使用して広範なテーマを設定

CSSカスタムプロパティは、コンポーネント構造に戦わなくても、全体的な雰囲気を最速で変更する方法です。

一般的な使用例は次のとおりです。

背景色とテキスト色 アプリが暗いカスタムパレットを持つ場合。
バックドロップの不透明度 デフォルトの暗めの影が弱すぎるか重すぎる場合。
スペーシングとサイズ 視覚的な密度が他のインターフェイスと一致する場合。

.file-actions-sheet {
  --background: #1b1f24;
  --color: #ffffff;
  --backdrop-opacity: 0.32;
  --button-color: #dce3ea;
  --button-background-hover: #2a3138;
}

影のパーツを使用する必要がある場合

デザインが特定の変更を求める場合、カスタムプロパティでは十分ではないことがあります。その場合はShadow Partsが役立ちます。Shadow Partsは、行動シートの内部領域をより直接的にスタイル化することを可能にします。

.file-actions-sheet::part(container) {
  border-radius: 18px 18px 0 0;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.24);
}

.file-actions-sheet::part(button) {
  font-weight: 600;
  letter-spacing: 0.01em;
}

.file-actions-sheet::part(backdrop) {
  backdrop-filter: blur(4px);
}

通常は、コンポーネントを過度にスタイリングすると、システムレベルの選択メニューの雰囲気を失うことになるので、効果が悪いです。必要なのは、複雑な行レイアウト、長い説明、リッチカード、サムネイルなど、行動シートパターンを超えている場合、パターンを超えていることになります。

良いカスタマイズパスは、コンポーネントをアプリに合わせることではなく、コンポーネントが何であるかを隠さないようにすることです。

高度なトピックとプラットフォームに関する考慮事項

生産的なアクションシートは、ほとんどのチュートリアルが認めるよりも大きな決定の空間で動作します。アクションシートのボタンラベルを選択するだけでなく、オーバーレイがIonicのWeb層によってレンダリングされるか、ネイティブUIに委ねられるか、プラットフォーム固有の動作をどれだけ強くしたいか、すべてのユーザーにとってシートが理解できるようにする方法を決定する必要があります。

2つの画像が表示されています。1つは黒い背景に抽象的な3D形状が表示されており、もう1つは緑の背景に石の背景に果物が表示されています。

Webコンポーネントまたはネイティブプラグイン

標準的なIonicアプリを構築している場合、通常はWebコンポーネントがデフォルトです。スタイルを簡単に変更でき、他のアプリのオーバーレイシステムと一貫して動作します。 ion-action-sheet Capacitorベースのアプリを構築している場合、ホストOSがシートをレンダリングすることを望む場合はネイティブルートを選択します。IonicはCapacitorプラグインを

If your app is Capacitor-based and you want the host operating system to render the sheet, the native route is @capacitor/action-sheet、Syncして showActions(options) -> Promise<ShowActionsResult>、また npm install @capacitor/action-sheet を使用し、WebとPWAコンテキストではPWA Elementsが必要であることを記載しています。 npx cap syncCapacitorベースのアプリを構築している場合、ホストOSがシートをレンダリングすることを望む場合はネイティブルートを選択します。IonicはCapacitorプラグインを 、インストールして in the Capacitor アクションシートプラグインドキュメント.

そのような実用的な取引表があります:

選択	強み	コスト
`ion-action-sheet`	より簡単なテーマ設定と共有Web UI パターン	ネイティブの忠実性がわずかに低下
`@capacitor/action-sheet`	ホストOSのレンダリングと強いプラットフォームの感覚	ブラウザとPWAのコンテキストで実装の制約が増える

視覚的的一貫性がアプリに重要な場合に、Webコンポーネントを使用してください。プラットフォームの忠実性が深いCSS制御よりも重要な場合に、ネイティブプラグインを使用してください。

プラットフォームモードとアクセシビリティの詳細

iOSとMaterial Designモードの両方で、Ionicはアダプティブです。スペース、動き、視覚的なtoneに影響を与えます。両方のモードでスタイリングが同じように動作することを前提にしないでください。特に、チームがすべてのプラットフォームで単一のモードを強制する場合、意図的に両方をテストしてください。

アクションシートは小さく感じるので、アクセシビリティが見落とされがちです。基本的なことはまだ重要です:

明確なボタンラベルを使用してください コンテキストからでも意味がわかるようにしてください。
リスクのあるアクションは destructive 予約してください 明確なラベルを使用してください
明確なラベルを使用してください cancel 装飾的な曖昧さを避けてください 似たようなアクションが存在するが、実際の結果は大きく異なる場合に注意してください
装飾的な曖昧さを避けてください 明確なラベルを使用してください

A screen reader または認知負荷制限のユーザーは、ラベルが曖昧な場合、簡単なオーバーレイを簡単に経験しないことがあります。

native と web アプローチは異なる問題を解決するため、ここで鋭いエッジがあります。Web コンポーネントは、外観と統合の制御を提供します。ネイティブプラグインは、プラットフォームの強力なアラインメントを提供します。どちらも自動的に優れているわけではありません。正解は、現在のアプリの痛みが視覚的一貫性、実装のスピード、またはシステムネイティブの動作であるかどうかにかかっています。

トラブルシューティングの落とし穴とライブ UI 修正の配信

ほとんどの Ionic アクションシートのバグは、最初に 3 つのボタンをワイヤーしてシミュレーターでタップするときに現れません。実際のナビゲーションとステートのトランジションと組み合わせて、シートがスタイリングされたときに現れます。

デモが動作するときに現れるバグ

最初のクラスのバグはタイミングです。code が閉じるのを待たずにロジックが実行されるため、オーバーレイがアニメーション中のルート変更や、コンポーネントのレンダリングと競合するステートの更新が見られます。

2 番目のクラスはレイアウトです。 Ionic の問題報告では、iOS デバイスの特定の条件下でアクションシートが下部セーフエリアに重なり合うことが報告されています。特に、__CAPGO_KEEP_0__ が非ゼロの場合、 Ionic のドキュメントのデモでこの問題が再現されることも報告されています。 --ion-safe-area-bottom この問題は、デバイスの形状、モード、カスタム CSS に依存するため、チームは遅い QA でこの問題を逃すことがよくあります。この問題は、 Ionic のドキュメントのデモで再現されることが報告されているため、GitHub の問題報告で bottom safe area の重なり合いについての問題についての問題報告を参照してください。問題報告の詳細は、__CAPGO_KEEP_0__ の問題報告で bottom safe area の重なり合いについての問題についての問題報告を参照してください。

Apractical safe area fix

アプリがホームインジケーターエリアに近い位置でシートを表示している場合、スコープドオーバーライドを使用するのではなく、広範なグローバルパッチを使用するのではなく、始めましょう。

.safe-area-sheet::part(container) {
  padding-bottom: calc(env(safe-area-inset-bottom) + 8px);
}

次に、作成するアクションシートでクラスを適用してください:

const sheet = await actionSheetController.create({
  header: 'More actions',
  cssClass: 'safe-area-sheet',
  buttons: [
    { text: 'Archive' },
    { text: 'Delete', role: 'destructive' },
    { text: 'Cancel', role: 'cancel' }
  ]
});

これは、すべてのオーバーレイを変更することなく、具体的な場所で始めるためのコンクリートの場所を与えますが、適切なデバイステストを置き換えるものではありません。

UIの欠陥のためのライブアップデートの重要性

リリースオペレーションの実際的な現実が明らかになります。安全エリアの不正規、破損したパディングルール、または破壊的なボタンの色がJavaScriptまたはCSSに生じた場合、待ち時間が長くなることなく、プロダクションに送信された場合、ユーザーの不満が数日続くことになります。

1つの実用的オプションは、Capacitorアプリ用のライブアップデートサービスです。たとえば Capgo 更新されたWebバンドルを提供することで、チームはJavaScript、CSS、コピー、設定、資産の修正を待つことなく、App Storeのレビューを待たずに、JavaScript、CSS、コピー、設定、資産の修正を実行できます。これは、スタイリングまたはオーバーレイのバグがQAを通過した場合に直接関連しています。

UIオーバーレイは、安全ネットが実際に効果を発揮するような機能です。小さなスタイリングの変更で簡単に破損し、通常はネイティブcodeを再構築することなく修正できるためです。

チームが定期的にIonicまたはCapacitorアプリを配信している場合 Capgo リリースワークフローにおける評価に値するものです。問題のアクションシートレイアウトのバグ、スタイリングのバグ、コピーミスなどに対するウェブ層の修正をリリース後にプッシュし、ロールアウトチャンネルとアップデートの制御を維持する方法を提供します。

Ionic Action Sheet: 2026 年の完全ガイド

Ionic Action Sheet: 2026 年の完全ガイドを使用している場合 Ionic Action Sheet: 2026 年の完全ガイドを使用している場合 __CAPGO_KEEP_0__ エンタープライズと連携して、企業の運用と移行計画を実施します。 Capgo エンタープライズの製品ワークフロー for the product workflow in Capgo Enterprise, __CAPGO_KEEP_0__ エンタープライズプラグインの代替の製品ワークフロー __CAPGO_KEEP_0__ 代替の製品ワークフロー Capgo 代替の製品ワークフロー Capgo コンサルティング Capgo Enterprise for the product workflow in Capgo Consulting, and Capgo Premium Support for the product workflow in Capgo Premium Support.

Ionic Action Sheet: A Complete Guide for 2026

目次

イオニックアクションシートの導入

Ionic 1のアクションシートドキュメントサマリーからTutorialsPoint

Understanding the Action Sheet Controller and API

APIは__CAPGO_KEEP_1__のアクションシートコントローラー

チームは、__CAPGO_KEEP_0__ の小さなサブセットしか必要としませんが、そのサブセットを正しく使用する必要があります。

Angular、React、Vueの実装例

Angularの例

React の例

In Ionic Vue、 __CAPGO_KEEP_0 は組成 CAPGO_KEEP_0__ 内できれいに機能します。

カスタマイズとスタイリング用のCSS

cssClassからグローバルオーバーライドを始める

カスタムプロパティを使用して広範なテーマを設定

影のパーツを使用する必要がある場合

高度なトピックとプラットフォームに関する考慮事項

Webコンポーネントまたはネイティブプラグイン

プラットフォームモードとアクセシビリティの詳細

トラブルシューティングの落とし穴とライブ UI 修正の配信

デモが動作するときに現れるバグ

Apractical safe area fix

UIの欠陥のためのライブアップデートの重要性

Ionic Action Sheet: 2026 年の完全ガイド

Ionic Action Sheet: A Complete Guide for 2026

目次

イオニックアクションシートの導入

Ionic 1のアクションシートドキュメントサマリーからTutorialsPoint

Understanding the Action Sheet Controller and API

APIは__CAPGO_KEEP_1__のアクションシートコントローラー

チームは、__CAPGO_KEEP_0__ の小さなサブセットしか必要としませんが、そのサブセットを正しく使用する必要があります。

Angular、React、Vueの実装例

Angularの例

React の例

In Ionic Vue、 __CAPGO_KEEP_0__ は組成 __CAPGO_KEEP_0__ 内できれいに機能します。

カスタマイズとスタイリング用のCSS

cssClassからグローバルオーバーライドを始める

カスタムプロパティを使用して広範なテーマを設定

影のパーツを使用する必要がある場合

高度なトピックとプラットフォームに関する考慮事項

Webコンポーネントまたはネイティブプラグイン

プラットフォームモードとアクセシビリティの詳細

トラブルシューティングの落とし穴とライブ UI 修正の配信

デモが動作するときに現れるバグ

Apractical safe area fix

UIの欠陥のためのライブアップデートの重要性

Ionic Action Sheet: 2026 年の完全ガイド

In Ionic Vue、 __CAPGO_KEEP_0 は組成 CAPGO_KEEP_0__ 内できれいに機能します。