vue模板开发，for循环里嵌套for循环

最新推荐文章于 2023-07-12 14:42:35 发布

小学生也要加班

最新推荐文章于 2023-07-12 14:42:35 发布

阅读量942

点赞数

分类专栏：自用初级前端文章标签： vue.js

本文链接：https://blog.csdn.net/weixin_44281416/article/details/111508715

版权

初级前端同时被 2 个专栏收录

43 篇文章 4 订阅

订阅专栏

自用

37 篇文章 0 订阅

订阅专栏

<div class="company-item" v-for="(item,index) in companyList">
    <el-row type="flex">
       <el-col :span="3">
          <img :src="base64Config[item.img]" />
       </el-col>
       <el-col :span="7" v-for="(ele,i) in item.list"  :key="i"><!--不能和上面的for循环重复-->
          <div>
              <span>{{ele.val}}</span>
              <span>{{ele.unit}}</span>
          </div>
          <div>{{ele.label}}</div>
       </el-col>
    </el-row>
</div>

  companyList: [
    {
      img: 'icon-person',
      list: [
        {
          val: 0,
          label: '单人成本',
          unit: '元',
        },
        {
          val: 0,
          label: '单人收入',
          unit: '元',
        },
        {
          val: 0,
          label: '效益值',
          unit: '元',
        },
      ],
    },
    {
      img: 'icon-bus',
      list: [
        {
          val: 0,
          label: '单车成本',
          unit: '万元',
        },
        {
          val: 0,
          label: '单车收入',
          unit: '万元',
        },
        {
          val: 0,
          label: '效益值',
          unit: '万元',
        },
      ],
    }
  ],