对BEM命名惯例感到困惑 - 需要纠正吗?

时间:2017-05-25 10:02:49

标签: css naming-conventions bem

我正在创建用于学习目的的电子商务网站,但我遇到了问题。我使用的是BEM命名惯例,而且我不知道我是否做得好,这是我的代码:

<div class="product product--miniature" data-id-product="{$product.id_product}" data-id-product-attribute="{$product.id_product_attribute}" itemscope itemtype="http://schema.org/Product">
  <figure class="product__thumbnail">
    <div class="product__badges">
      <span class="badge badge--{$flag.type}">{$flag.label}</span>
    </div>
    <img src="{$product.cover.medium.url}" alt="{$product.cover.legend}" data-full-size-image-url="{$product.cover.large.url}">
  </figure>
  <div class="product__info">
    <h3 class="product__name" itemprop="name"><a href="{$product.url}">{$product.name}</a></h3>
    <div class="product__prices">
      <span class="price" itemprop="price">{$product.price}</span>
      <span class="price--discount">{$product.regular_price}</span>
    </div>
  </div>
</div>

我对产品徽章和产品价格存在最大问题,我觉得那里有些不对劲?

1 个答案:

答案 0 :(得分:1)

The only thing I can see to consider here is the use of the price and badge block classes. If they can exist on their own (outside of the product block) then what you have is fine. However, if they will only ever exist inside a product then you might like to change them to product__price and product__badge