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;
  }
相关推荐
zy0101012 小时前
HTML标签
前端·css·html
果粒chenl2 小时前
css+js提问
前端·javascript·css
学代码的小前端12 小时前
0基础学前端-----CSS DAY13
前端·css
engchina14 小时前
@media 的常用场景与示例
css·media
林的快手15 小时前
CSS列表属性
前端·javascript·css·ajax·firefox·html5·safari
烂蜻蜓20 小时前
Uniapp 设计思路全分享
前端·css·vue.js·uni-app·html
qianmoQ1 天前
第五章:工程化实践 - 第三节 - Tailwind CSS 大型项目最佳实践
前端·css
~废弃回忆 �༄1 天前
CSS中伪类选择器
前端·javascript·css·css中伪类选择器
薛定谔的猫-菜鸟程序员1 天前
Vue 2全屏滚动动画实战:结合fullpage-vue与animate.css打造炫酷H5页面
前端·css·vue.js
想睡好2 天前
css文本属性
前端·css