GitLab

问题

如图所示，tab从需求切换到押金，由于押金没有更新日期，所以隐藏了一行，导致整体布局发生变更，下方数据尽无法正常渲染上去
ps：此问题仅发生在app内嵌webview上，在chrome上正常

问题分析

table的渲染机制与整体渲染冲突导致，vue2并非使用通过合并后批量更新的机制，而是沿用了逐步渲染的机制。在整体布局和table渲染布局上出现了节点冲突。

解决方法

起初：在 this.updated 值发生变更后，通过 this.$nextTick进行先布局再填充 tableData数据
最终发现还是不行，尝试在次之后添加一个宏任务后可行

this.updated = response.updated_at;
this.$nextTick(() => {
    setTimeout(() => {
        this.tableData = response.data;
    }, 0);
});