Vue + Element UI 如何动态设置表头，实现“上周”和“本周”的效果？

如何使用 vue + element ui 动态设置表头？

想实现类似图片的效果，以“上周”和“本周”作为表头，如何实现？

解决之道：

使用两个变量分别表示上周和本周的时间范围，然后将其设置在 el-table-column 组件的 label 属性中即可。

至于上周和本周的时间范围，可以参考 JS 获取当前上周和当前周的周一和周日日期的方法。

举例：

let lastweek = '11-14 ~ 11-20'
let thisweek = '11-21 ~ 11-22'

<el-table-column label="上周"><el-table-column prop="state" :label="lastweek" width="120"></el-table-column></el-table-column><el-table-column label="本周"><el-table-column prop="state" :label="thisweek" width="120"></el-table-column></el-table-column>

以上就是Vue + Element UI 如何动态设置表头，实现“上周”和“本周”的效果？的详细内容，更多请关注其它相关文章！