useCartDeliveryModes(id?: string)

The useCartDeliveryModes() composable allows for:

  • loading and storing delivery modes available for a cart
  • setting a delivery mode on a cart

useCartDeliveryModes() should be treated as an extension for useCart(). To bind particular instances of the useCart() and useCartDeliveryModes() together, they simply have to be called with the same unique id as the only argument.

Example

In the following example we are loading a new session cart using useCart().load method and loading available delivery methods with the useCartDeliveryModes() composable.

import { onMounted } from '@nuxtjs/composition-api';
import { useCart, useCartDeliveryModes } from '@vsf-enterprise/sapcc';

export default {
  setup() {
    const { load: loadCart } = useCart('unique-id');
    const { load: loadCartDeliveryModes } = useCartDeliveryModes('unique-id');

    onMounted(async () => {
      await loadCart();
      await loadCartDeliveryModes();
    });
  }
}

Be careful about shared state

You should pass a unique id as a parameter to avoid state conflicts when using multiple instances of this composable. Every instance with the same id (or those that lack it) will share the same state, even on different pages.

deliveryModes

Main data object populated by the load() method.

Type

const deliveryModes: ComputedProperty<DeliveryMode[]>

References: DeliveryMode

loading

Indicates whether any of the composable methods is in progress.

Type

const loading: ComputedProperty<UseCartDeliveryModesLoading>;

References: UseCartDeliveryModesLoading

error

Contains errors thrown by any of the composable methods.

Type

const error: ComputedRef<UseCartDeliveryModesError>;

References: UseCartDeliveryModesError

load()

Fetches delivery modes available for a cart and saves them in the deliveryModes property. Under the hood, it calls the getCartDeliveryModes API endpoint.

Type

async function load(props?: BaseProps): Promise<void>

References: BaseProps

Example

In the following example, we are fetching available delivery modes for a cart. We are also specifying a subset of fields we want to receive with the response.

import { onMounted } from '@nuxtjs/composition-api';
import { useCartDeliveryModes } from '@vsf-enterprise/sapcc';

export default {
  setup() {
    const { load: loadCartDeliveryModes } = useCartDeliveryModes('unique-id');

    onMounted(async () => {
      await loadCartDeliveryModes({ fields: 'deliveryModes(code,name,deliveryCost)' });
    });
  }
}

set()

Sets the delivery mode for a cart and updates the cart object of the bound useCart() composable. Under the hood, it calls the replaceCartDeliveryMode API endpoint.

Type

interface SetCartDeliveryModesProps extends BaseProps {
  deliveryModeId: string
}

async function set(props?: SetCartDeliveryModesProps): Promise<void>

References: SetCartDeliveryModesProps, BaseProps

Example

In this example we are creating a simple wrapper around the set() method. It accepts a raw DeliveryMode object and calls the set() method with the right arguments.

import { useCartDeliveryModes } from '@vsf-enterprise/sapcc';

export default {
  setup() {
    const { set } = useCartDeliveryModes('unique-id');

    const setCartDeliveryMode = async (deliveryMode) => {
      const { code } = deliveryMode;
      await set({ deliveryModeId: code });
    };

    return { setCartDeliveryMode };
  }
}