@nexuspoint/apex-cart

NexusPoint Apex Shopping Cart

This packages comprises:

• AddToCart button
• Cart page
• MiniCart widget with a dropdown

AddToCart

This button goes on a product listing or product detail page. You can add a button class and provide whatever content you like for the inner HTML of the button.

Example

<add-to-cart 
        button-class="add-to-cart"
        :item-id="1000"
        :price="12.34"
        url="http://www.example.com/shop/products/some-product"
        name="Some Product"
    >
    <span> <!-- Here is where you put the button content -->
        <i class="fa fa-shopping-cart" aria-hidden="true"></i>
        Add To Cart
    </span>
    <span slot="whenAdded"> <!-- Here is where you put the button content for when an item is added -->
        <i class="fa fa-shopping-cart" aria-hidden="true"></i>
        Remove
    </span>
</add-to-cart>

Mini Cart

This goes in the header. It states how many items are in the cart and gives a dropdown mini cart on click. Additionally, it provides a button may be provided inside the item to link to the main cart page.

Example

<mini-cart>
    <!-- Here is where you can put a button to link to your main cart page -->
    <a href="/shop/cart" class="btn btn-primary btn-block">
        Go to Cart
    </a>
</mini-cart>

Cart Page

Place this component on your main cart page.

Example

<cart></cart>