vue去掉循环数组中的最后一组的某个样式style/class

vue去掉循环数组中的最后一组的某个样式style/class

需求:要实现这样的排列

现状

发现,最后一个格子并没有跟下面绿色线对齐。

最后发现 是因为 每个格子都给了 margin-right:36px,影响到了最后一个格子

所以要 将最后一个格子的margin 属性去掉

html 复制代码
  <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

css 复制代码
 .muPart {
    display: flex;
  }

  .murightPart {
    margin-right: 36px;
  }
相关推荐
世俗ˊ22 分钟前
CSS入门笔记
前端·css·笔记
茶茶只知道学习1 小时前
通过鼠标移动来调整两个盒子的宽度(响应式)
前端·javascript·css
susu10830189112 小时前
前端css样式覆盖
前端·css
东方翱翔2 小时前
CSS的三种基本选择器
前端·css
Fan_web3 小时前
JavaScript高级——闭包应用-自定义js模块
开发语言·前端·javascript·css·html
Java开发追求者3 小时前
在CSS中换行word-break: break-word和 word-break: break-all区别
前端·css·word
pink大呲花4 小时前
css鼠标常用样式
前端·css·计算机外设
天高任鸟飞dyz15 小时前
html加载页面
css·html·css3
Rverdoser20 小时前
unocss 一直热更新打印[vite] hot updated: /__uno.css
前端·css
MZZ骏马1 天前
svg与css关联
前端·css