Skip to main content
Componente de card de produto pronto para uso em grades. Exibe imagem com lazy loading, nome, marca, preços e botão de adicionar ao carrinho. É o bloco base de qualquer listagem de produtos.

​
Uso

<ProductCard :product="product" image-size="medium" />
Dentro de um slot de Grid ou Collection: 
<Collection :collection-id="1" :total-products="8">
  <template v-slot="{ product }">
    <ProductCard :product="product" />
  </template>
</Collection>

​
Propriedades

PropriedadeTipoObrigatóriaValor padrãoDescrição
productObject✅—Objeto do produto com todos os dados (nome, preços, imagens, etc.).
imageSizeString❌'default'Tamanho da imagem do card. Valores: 'default' ou 'medium'.