【VUE】vue + element-ui实现表格一个单元格中加多行数据

需求背景table表格要实现如下效果，一行数据会对应多个数据。效果如下:代码开发<el-table-column prop="listAlarmGroups" fixed="right" label="报警组" width="200"><template slot-scope="scope"><div slot="reference" class="name-wrap

kiraraLou

5024人浏览 · 2021-06-03 18:31:40

kiraraLou · 2021-06-03 18:31:40 发布

需求背景

table表格要实现如下效果，一行数据会对应多个数据。效果如下:
在这里插入图片描述

代码开发

<el-table-column prop="listAlarmGroups" fixed="right" label="报警组" width="200">
        <template slot-scope="scope">
          <div slot="reference" class="name-wrapper" v-for="(item,index) in scope.row.listAlarmGroups" :key="index">
               <el-tag>{{ item }}</el-tag>
          </div>
        </template>
</el-table-column>

Vue

前往低代码交流专区

更多推荐

Vue里echarts根据页面大小动态调整/自适应

Vue

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^