element 表格如何在一行内容显示两行的数据?

element 表格如何在一行内容显示两行的数据?

element 表格中一行显示两行的数据

当前存在的问题是,表格中需要在一个通道名下同时展示当天的数据和昨天的数据。

从后端提供的 json 数据中可以看出,每个通道都包含了 "today" 和 "yesterday" 的数据,因此可以利用模板槽来实现两行数据在同一行的显示。

修改后的前端代码如下:

<el-table-column prop="todayNewly" label="当日新增" header-align="center"><template slot-scope="scope"><el-row prop="today">{{ scope.row.todayNewly.today }}</el-row><el-row prop="yesterday">{{ scope.row.todayNewly.yesterday }}</el-row></template></el-table-column>

将模板插槽添加到 todaynewly 列定义中,并使用 scope 访问当前行的 today 和 yesterday 数据。这将针对每个通道名称生成两行,显示其当日新增数据和昨日新增数据。

以上就是element 表格如何在一行内容显示两行的数据?的详细内容,更多请关注其它相关文章!