element-ui 中 el-popover 组件嵌套表格，如何使表格数据动态刷新？

Question

简化描述如下。

组件代码：

如上，主页面有一个el-table，页面加载时，通过自定义的this.getData()函数从后台数据库获取到tableData数据，其结构：

tableData: [

    {name: [{firstName: 'Nick', lastName: 'Young'}], age:22},

    {name: [{firstName: 'Allen', lastName: 'Zhang'}], age:23}

]

当点击查看按钮时，能够正常显示el-popover中嵌入的表格数据。

另外有一个editData()函数，它的功能是：向后台发送put请求，修改数据库中的一条数据，比如将

{name: [{firstName: 'Allen', lastName: 'Zhang'}], age:23}

修改为：

{name: [{firstName: 'Jack', lastName: 'Ma'}], age:18},

然后调用this.getData()函数刷新当前tableData数据。

现在问题来了。实际中，当执行this.editData()函数后，点击查看按钮，并不会显示el-popover中的表格数据；但是当刷新当前页面后，就能够正常显示出来。

目前找了一个比较笨的解决方法：在editData()函数的最后使用this.$router.push刷新当前页面，弊端是页面有较为明显的刷新动效，体验不佳。

请问各位碰到过类似问题么？有啥比较好的解决方法没？

Answer 1

没更新的话应该是你的table中的数值没更新成功,tableData.push('a');tableData.pop('a');从而促使table中的数值更新成功，就可以了