关于自己写的 table 组件上下居中的问题

Question

如何让 3 上下居中,

不是 table 布局的
原图是这样的

想实现一个合并行的功能 数据不需要关注随意字符串

Answer 1

改变布局，红色为table，绿色为tr
下面的数据分成左右两个table，然后左边的数据flex布局垂直居中下就好了

Answer 2

首先先分析一下问题：
标题要求：table 居中
内容要求：合并单元格

所以，其实真正的目的是解决合并单元格之后的居中问题
那么，我们可以先看一下成熟 ui 框架的案例：推荐个 ele-ui

<tr class="el-table__row">
    <td rowspan="2" colspan="1" class="el-table_22_column_90  ">
        <div class="cell">12987122</div>
    </td>

感觉还是 table 格式的好解决合并的问题 ...
主流的几个框架看了一圈都是 table元素 来解决表格的问题，除非你不准备搞定合并的问题

或者按照模板逆推 ...
生成 position:absolute 的 div 挡住应该显示的合并区域？
感觉思路不是很靠谱的样子