スタートガイド

インストール

AIアシストによるセットアップでプラグインをインストールできます。以下のコマンドを使用して、お使いのAIツールに Capgo のスキルを追加してください：

npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

次に、以下のプロンプトを使用します：

Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-pretty-toast` plugin in my project.

手動セットアップを希望する場合は、以下のコマンドを実行してプラグインをインストールし、下記のプラットフォーム別の手順に従ってください：

npm install @capgo/capacitor-pretty-toast
npx cap sync

インポート

import { toast } from '@capgo/capacitor-pretty-toast';

クイックスタート

import { toast } from '@capgo/capacitor-pretty-toast';

toast.success('Saved', { message: 'Draft synced.' });

よくある落とし穴

• IDの読み込み: 呼び出し時にIDを保持 toast.update().
• デバウンス: 短時間の連続エラーは1つのトーストにまとめます。
• ブランディング: プラットフォームごとにアイコンと色を調整します。

トーストを表示

toast.success('Saved', {
  message: 'Your changes are ready.',
});

ローディングToastを更新する

const id = toast.loading('Uploading', {
  message: 'Waiting for the server response.',
});

setTimeout(() => {
  toast.update(id, {
    title: 'Upload complete',
    message: 'The file was stored successfully.',
    icon: 'checkmark.circle.fill',
    autoDismiss: true,
  });
}, 1500);

Promiseを追跡する

await toast.promise(uploadFile(), {
  loading: {
    title: 'Uploading',
    message: 'Keep the app open while the file is sent.',
  },
  success: 'Uploaded',
  error: 'Upload failed',
});

アイコンと画像

使用する icon シンボル名または生のSVGマークアップを指定する場合:

toast.info('New message', {
  icon: 'message.fill',
  message: 'Open the inbox to reply.',
});

使用する iconSource URI風の画像用。サポート対象は https://, http://, file://, data:, blob:、絶対ファイルパス、または { uri }.

toast.show({
  title: 'Profile updated',
  message: 'Your avatar changed.',
  iconSource: 'https://example.com/avatar.png',
});

iconSource が優先されます icon.

Getting Startedの続きを進める

使用している場合 スタートガイド ネイティブプラグインの作業を計画するには、次と連携してください： Capgo プラグインディレクトリ Capgo プラグインディレクトリのプロダクトワークフローについては、 Capgo による Capacitor プラグイン Capgo による Capacitor プラグインの実装詳細については、 プラグインの追加または更新 プラグインの追加または更新に関する実装詳細については、 Ionic Enterprise プラグインの代替案 Ionic Enterprise Plugin Alternatives のプロダクトワークフロー、および Capgo Native Build Capgo Native Builds のプロダクトワークフローについては、