HomeWiki
HomeWiki
  1. Cart
  • Back to home
  • 1. Themes
  • Layout
    • New Layout
    • Legacy Layout
  • Components
    • Announcement
    • Banner Carousel
    • Banner With Products Carousel
    • Blog Category List
    • Blog List
    • Brand List
    • Brands Carousel
    • Breadcrumb
    • Call To Action
    • Cart
    • Categories List
    • Change Password
    • Checkout
    • Cookie Manager
    • Filter list
    • Footer
    • Forgot Password
    • Form
    • Hero Carousel
    • Icon Block
    • Invitation
    • Last Visited Products
    • Layout
    • Login
    • Map
    • Nav Bar
    • Offer
    • Product Attachments
    • Product Attributes
    • Product Documentation
    • Product Expected
    • Product Modal
    • Products Block
    • Products Carousel
    • Product Single
    • Profile
    • Quote
    • Register
    • Related Products
    • Search
    • Stores
    • Subscribe Newsletter
    • Text with Image
    • Top Bar
    • Video
  • Reusables
    • Getting Started
  • Assets
    • Getting Started
  • SDK
    • Products
      • _findProductsByCategory
      • _findProductsByIds
      • _findProductsByTitle
      • _findProductsByFilter
      • _findProductsByCriteria
      • _findProductsAndCalculate
      • _findProductsThenCalculate
      • _getProductAttributeSet
      • _setLastVisited
    • Categories
      • _findCategoryTreeById
      • _findCategoriesByIds
      • _findCategoryByAlias
      • _findCategoryTreeByAlias
      • _getCategoryContent
    • Collections
      • _getCollectionContent
      • _findCollectionsByIds
      • _findCollectionsByIdsThenCalculate
    • Brands
      • _getBrandContent
      • _findBrandsByIds
    • Cart
      • _addToCartMulti
      • _addToCart
      • _setCart
      • _clearCart
      • _setCartListener
      • _removeFromCart
      • _calculateCart
    • Checkout
      • _startCheckout
      • _updateCheckout
      • _completeCheckout
    • Shopping Lists
      • _getShoppingLists
      • _updateShoppingList
      • _createShoppingList
      • _deleteShoppingList
      • _getShoppingListByAlias
    • Navigation
      • _getFooterMenu
      • _getHeaderMenu
    • Users
      • _getUserById
    • Utils
      • _calculateCurrency
      • _getCurrencySymbol
      • _getCulture
      • _subscribeToNewsletter
      • _findUnitsByIds
  • Vs Code
    • Getting Started
  1. Cart

_addToCart

How to Use _addToCart Method#

The _addToCart method adds a specified product variant to the user's shopping cart. It handles authentication, manages the cart token, and updates local storage with the latest cart data. This method uses async/await syntax for cleaner and more manageable asynchronous code.

Usage Steps:#

1.
Provide Product Details:
The method requires three parameters:
productId: The unique identifier of the product you want to add.
variantId: The unique identifier of the product variant.
quantity: The quantity of the product variant to add.
2.
Call the Method:
Call the _addToCart method with the required parameters. The method returns a promise that resolves with the response data or an error.
3.
Handle the Response:
Use async/await or .then()/.catch() to handle the response or error from the method.

Example:#

Common Use Cases:#

1.
Adding Items to Cart:
This method is used to add products to the shopping cart from various parts of your application, such as product detail pages, product listings, or quick view modals.
2.
Managing Cart Token:
For authenticated users, the method ensures the cart token is available and up-to-date. It fetches a new token if needed and updates local storage accordingly.
3.
Updating Cart State and UI:
The method updates the cart in local storage and emits a "cart-changed" event, which can trigger UI updates or other actions related to cart changes, like updating the cart icon or displaying a notification.

Notes:#

Async/Await Syntax: The method uses async/await for handling asynchronous operations, making the code more readable and easier to debug compared to traditional promise chains.
Error Handling: The method includes a try/catch block to handle errors that might occur during the API requests. If an error occurs, it returns the error response.
Local Storage Management: The method manages local storage to ensure the cart state is maintained across different parts of the application and between sessions.
Event Emission: After updating the cart, the method emits a "cart-changed" event, allowing other parts of the application to react to the cart update.
This method provides a robust and efficient way to add items to the shopping cart, handle authentication, and manage cart state in an e-commerce application.
Previous
_addToCartMulti
Next
_setCart
Built with