selectSelectedPayment$(): Observable<BasketPayment | undefined>¶

The selectSelectedPayment$ method provides an observable stream that emits events whenever the selected payment option changes, allowing you to react to these changes in real-time.

Returned value¶

A returned value has a type of Observable<BasketPayment | undefined> where BasketPayment represents the BasketPayment model, which emits the currently selected payment method and updates whenever the selection changes.

Example¶

In this example, we subscribe to the selectSelectedPayment$ observable to monitor changes to the selected payment option.

useStorefront(async (storefront) => {
    let basketPaymentsApi = storefront.getApiSync('basketPaymentsApi');

    if (!basketPaymentsApi) {
        const featureSystemApi = this.getApiSync('FeatureSystemApi');
        await featureSystemApi.registerDynamic('basket');

        basketPaymentsApi = storefront.getApiSync('basketPaymentsApi');
    }

    const selectedPayment$ = basketPaymentsApi.selectSelectedPayment$();

    selectedPayment$.subscribe((selectedPayment) => {
        if (selectedPayment) {
            console.log('Payment option selected:', selectedPayment);
        } else {
            console.log('No payment option is currently selected.');
        }
    });
});

Basket Payments API methods reference¶

Models reference¶

BasketPayment