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;
  }
相关推荐
咬人喵喵7 小时前
CSS 盒子模型:万物皆是盒子
前端·css
暴富暴富暴富啦啦啦9 小时前
声音波浪 js+css
css·html·css3
三年三月13 小时前
React 中 CSS Modules 详解
前端·css
苏打水com14 小时前
第十二篇:Day34-36 前端工程化进阶——从“单人开发”到“团队协作”(对标职场“大型项目协作”需求)
前端·javascript·css·vue.js·html
软件技术NINI15 小时前
盒模型在实际项目中有哪些应用场景?
前端·css·html
苏打水com18 小时前
第十篇:Day28-30 工程化优化与部署——从“能跑”到“好用”(对标职场“项目上线”需求)
前端·css·vue·html·js
用户66006766853919 小时前
纯 CSS 复刻星战开场:让文字在宇宙中滚动
前端·css
李少兄19 小时前
前端开发中的多列布局(Multi-column Layout)
前端·css
苏打水com20 小时前
第十一篇:Day31-33 前端安全与性能监控——从“能用”到“安全可靠”(对标职场“系统稳定性”需求)
前端·javascript·css·vue.js·html
syt_101321 小时前
grid布局之-子项放置1
前端·javascript·css