useCartAddresses(id?: string)

The useCartAddresses() composable allows for:

• creating a new delivery address for a cart
• assigning an existing delivery address to a cart
• removing a delivery address from a cart
• adding an email address to a cart

useCartAddresses() should be treated as an extension for useCart(). To bind particular instances of the useCart() and useCartAddresses() 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 exposing additional functionalities (i.e. adding and removing delivery addresses) with the useCartAddresses() composable.

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

export default {
  
  setup() {
    const { cart, load } = useCart('unique-id');
    const { add: addDeliveryAddress, remove: removeDeliveryAddress } = useCartAddresses('unique-id');

    onMounted(async () => {
      await load();
    })

    return { addDeliveryAddress, removeDeliveryAddress };
  }
}

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.

loading

Indicates whether any of the composable methods is in progress.

Type

const loading: ComputedProperty<UseCartAddressesLoading>;

References: UseCartAddressesLoading

error

Contains errors thrown by any of the composable methods.

Type

const error: ComputedRef<UseCartAddressesLoading>;

References: UseCartAddressesError

addEmail()

Assigns an email address to a cart and updates the cart object of the bound useCart() composable. Under the hood, it calls the addGuestEmailToCart API endpoint.

Good to know!

In SAP Commerce Cloud, the sole purpose of assigning an email address to a cart is to allow a guest checkout. Therefore, the addEmail() method works with anonymous carts only. An anonymous cart which has been assigned an email cannot be turned into a user cart anymore.

Type

interface AddCartEmailProps extends BaseProps {
  email: string
}

async function addEmail: (props: AddCartEmailProps): Promise<void>;

References: AddCartEmailProps, BaseProps

Example

In this example we are creating a simple wrapper around the addEmail() method which will call it with correct arguments. We are also specifying a subset of fields we want to receive with the updated cart object.

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

export default {
  setup() {
    const { addEmail } = useCartAddresses('unique-id');

    const addEmailFromForm = async (form) => {
      const { email } = form;
      await addEmail({ email, fields: 'FULL' });
    };

    return { addEmailFromForm };
  }
}

create()

Creates and assigns a new delivery address for a cart and updates the cart object of the bound useCart() composable. Under the hood, it calls the createCartAddress API endpoint.

Type

interface CreateCartAddressProps extends BaseProps {
  address: Address;
}

async function create: (props: CreateCartAddressProps): Promise<void>;

References: CreateCartAddressProps, BaseProps, Address

Example

In this example we are creating a simple wrapper around the create() method which will call it with correct arguments. We are also specifying a subset of fields we want to receive with the updated cart object.

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

export default {
  setup() {
    const { create } = useCartAddresses('unique-id');

    const createCartAddress = async (address) => {
      await create({ address, fields: 'FULL' });
    };

    return { createCartAddress };
  }
}

replace()

Assigns an existing delivery address to a cart and updates the cart object of the bound useCart() composable. Under the hood, it calls the replaceCartAddress API endpoint.

Type

interface ReplaceCartAddressProps extends BaseProps {
  addressId: string;
}

async function replace: (props: ReplaceCartAddressProps): Promise<void>;

References: ReplaceCartAddressProps, BaseProps

Example

In this example we are creating a simple wrapper around the replace() method which will call it with correct arguments. We are also specifying a subset of fields we want to receive with the updated cart object.

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

export default {
  setup() {
    const { replace } = useCartAddresses('unique-id');

    const replaceCartAddress = async (addressId) => {
      await replace({ addressId, fields: 'FULL' });
    };

    return { replaceCartAddress };
  }
}

remove()

Removes an existing delivery address from a cart and updates the cart object of the bound useCart() composable. Under the hood, it calls the removeCartAddress API endpoint.

Type

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

References: BaseProps

Example

In this example we are creating a simple wrapper around the remove() method which removes a delivery address from the cart stored in the useCart('unique-id') composable. We are also specifying a subset of fields we want to receive with the updated cart object.

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

export default {
  setup() {
    const { remove } = useCartAddresses('unique-id');

    const removeCartAddress = async () => {
      await remove({ fields: 'FULL' });
    };

    return { removeCartAddress };
  }
}