汕头建站价格,2008年做的网站,哪个网站域名更新快,衡阳网建天地一.思路
首先我们肯定得循环表头#xff0c;我们原生js封装的表格的实现原理就是这样。其次我们要把自己循环的label显示出来#xff0c;对应的prop也要和表格数据相对应。用div标签循环都会出现错误#xff08;div里面套column#xff09;#xff0c;大家不要踩坑。第一…一.思路
首先我们肯定得循环表头我们原生js封装的表格的实现原理就是这样。其次我们要把自己循环的label显示出来对应的prop也要和表格数据相对应。用div标签循环都会出现错误div里面套column大家不要踩坑。第一项会跑到最后一项去掉div即可。
二.代码
// html部分 用template循环也可以
div classtableDivel-table :datatableData height250 border stylewidth: 100%el-table-column v-for(col, index) in cols :keyindex :propcol.prop :labelcol.labelheader-aligncenter width155 aligncenter/el-table-column/el-table/div// js部分 注意cols数据格式
data () {return {cols: [{label: 姓名,prop: name},{label: 年龄,prop: age},{label: 身高,prop: clas},{label: 职业,prop: job},{label: 工作经历,prop: jobs}],tableData: [{name: 禹宝宝,age: 18,clas: 185,job: 三目运算符创始人,jobs: vue4.0突出贡献者}]};},
三.为什么div不行 prop和label是cols中的属性也是el-table-column标签里设置的属性放在div里就不是那个属性了简单来说就是div中的prop和label与el-table-column没关联起来