发布时间:2021-02-07 09:53:24编辑:admin阅读(3717)
现有一个基于element-ui开发的后台页面,效果如下:
需要将公司名进行切割,每一行,显示一个公司。
test.vue
<template> <el-table :data="tableData" border style="width: 362px"> <el-table-column prop="id" label="id" width="180"> </el-table-column> <el-table-column prop="name" label="公司名" width="180"> <template slot-scope="scope"> <div v-for="item in companyCut(scope.row.name)"> {{item}}<br> </div> </template> </el-table-column> </el-table> </template> <script> export default { name: "test", data() { return { tableData: [{ id: '2016-05-02', name: '阿里云', }, { id: '2016-05-04', name: '腾讯控股、字节跳动', }, { id: '2016-05-01', name: '美团、金蝶国际、台积电', }] } }, methods: { // 切割公司列表 companyCut(name){ let company=name.split("、") return company }, } } </script> <style scoped> </style>
效果如下:
上一篇: ElementUI 分页
下一篇: vue 验证码
47743
46233
37108
34625
29227
25883
24743
19861
19414
17906
5713°
6312°
5832°
5885°
6981°
5827°
5842°
6358°
6313°
7670°