vlocity-dc-offer-list-view is the component for product list view.
Constructor
new VlocityDCOfferListView()
Properties:
Name
Type
Description
offers
Object
indicates an object which contains a list of all the offers.
Example
Sample Usage -
Include the component in your template simply by adding vlocity-dc-offer-list-view custom tag
<vlocity-dc-offer-list-view .offers="${productList}"></vlocity-dc-offer-list-view>
| Attribute Name | Type Expected | Required |
|-------------------|---------------------------------------------------------------------------------|----------|
| offers | An object which contains a list of all the offers | Required |
KEY INFO -
events fired : "vlocity-dc-offer-selected"
events registered : none
Dependency - vlocity-offer-list-view is a component used to render list view of offer list and is commonly used as a child of vlocity-dc-offer-list
but can also be used as an independent component
| Parent Component | Expected Children Components |
|-------------------------|----------------------------------------|
| vlocity-dc-offer-list | vlocity-dc-offer-list-view-image |
| | vlocity-dc-offer-list-view-price |
| | vlocity-dc-offer-list-view-attribute |
Sample with slots -
<vlocity-offer-list-view>
<span slot="{slot_name}">
Custom HTML elements goes here
</span>
</vlocity-offer-list-view>
List of available slots -
| Slot names | Dynamic | Description | Impact |
|-----------------------------|-------------|----------------------------------------------------|
| dc-offer-list-price-wrapper | - | Wrapper for template | Replaces DOM |
| dc-offer-title-container | - | Offer title | Replaces DOM |
Extends
LitElement
Members
(static, readonly) properties
Properties that will be available in the template binding
Properties:
Name
Type
Description
offers
Object
indicates an object which contains a list of all the offers.
Methods
(static) getProductUrl(item)
Parameters:
Name
Type
Description
item
object
An object containing navigation info
Returns the url from the offerDetailsAction, so that details page will have this url
(static) offerSelected(item)
Parameters:
Name
Type
Description
item
object
An object containing navigation info
Fires "vlocity-dc-route-navigation" which register in 'dc-main' to update selected offer code
Navigates to config page with selected offer