Bootstrap-vue table _showdetails 在数据更新时关闭

Question

我有一个 bootstrap-vue 表，它绑定到一个计算属性，该属性从我的 vuex 存储中获取一些数据。

每一行都有一个 show_details 按钮，根据此链接打开第二行： https://bootstrap-vue.js.org/docs/components/table/#row-details-support

但是，当我的 vuex 存储中的数据发生变化时，表格会重新渲染并失去其状态（所有打开的“show_details”行都返回关闭状态）。

有什么方法可以更新store和table中的table数据，而不丢失table的当前状态？

Answer 1

一旦从后端接收到新数据，在更新存储之前，您可以循环遍历旧表项数组以查找 _showDetails 属性，然后更新新数据数组设置 _showDetails 如果行是相同的（例如通过使用主键或其他唯一行标识符来关联行）。然后使用新数据更新您的商店商品数组。