Vue はループ配列の最後のグループの特定のスタイル/クラスを削除します

Vue はループ配列の最後のグループの特定のスタイル/クラスを削除します

要件: このような取り決めを達成するには

ここに画像の説明を挿入

現状

ここに画像の説明を挿入

最後のグリッドが下の緑色の線と揃っていないことが判明しました。

最終的に、各グリッドが与えられているためmargin-right:36px、最後のグリッドに影響を与えることが判明した
ため、最後のグリッドの属性をmargin削除する必要があります。

  <div v-for="(item, index) in exportData.slice(3, 8)" :key="index">
      <div class="devicePart rectImg defaultrectImg"
:class="index === exportData.slice(3, 8).length - 1 ? '' : 'murightPart'">
        <div class="deviceTitle">{
   
   { item.name.slice(0, 2) }}</div>
           <div class="deviceTitle">{
   
   { item.name.slice(2, 5) }}</div>
       </div>
     </div>
 </div>

css

 .muPart {
    
    
    display: flex;
  }

  .murightPart {
    
    
    margin-right: 36px;
  }

おすすめ

転載: blog.csdn.net/Maxueyingying/article/details/132602138