# 提供者

Context Provider 是 `@blocklet/payment-react` 的一個核心概念。它們作為您應用程式部分的包裝器，使用 React 的 Context API 將必要的資料和函式傳遞給所有嵌套在其中的元件。這避免了需要手動將 props 透過多層元件樹向下傳遞。

要使用此函式庫中的大多數元件，您必須用適當的 provider 包裝您的應用程式或相關頁面。

<!-- DIAGRAM_IMAGE_START:architecture:16:9::1765377042 -->
![Providers](assets/diagram/providers-01.zh-TW.jpg)
<!-- DIAGRAM_IMAGE_END -->

此函式庫提供兩個主要的 provider，每個都有不同的用途。請選擇適合您需求的 provider。

<x-cards>
  <x-card data-title="PaymentProvider" data-icon="lucide:package" data-href="/providers/payment-provider">
    幾乎所有與支付相關的操作都需要的基礎 provider。它管理支付方式、貨幣設定、使用者工作階段資訊，並提供一個預先設定的 API 用戶端。
  </x-card>
  <x-card data-title="DonateProvider" data-icon="lucide:heart" data-href="/providers/donate-provider">
    一個專為捐贈功能設計的 provider。它處理捐贈小工具的設定和狀態，例如使用 CheckoutDonate 元件實作的那些。
  </x-card>
</x-cards>

點擊上方的 provider 以查看其詳細文件，包括必要的 props 和設定範例。