vue.js - Vue中watch监听导致的组件间数据更新问题如何处理？

Question

index.vue 《父组件》

点击详情会弹出模态框detail组件
点击detail组件的按钮会弹出reset模态框
detail传值数据格式

{    id："1",    name:"uu-sdfffffff"}

点击reset组件里的reset按钮会重置某个字段，目前使用watch监听可以做到点击reset按钮刷新detial模态框里的数据和index的数据，但是问题就出在点击index的另一条数据的详情同样会执行watch这个怎么解决呢

Answer 1

不知道你的期望使用 watch 来实现什么需求。也许可能是为了刷新当前分页列表中的历史旧数据。

那么正常来说应该在的 Reset弹窗 提交完成之后，通过 emit 抛出一个提交完成事件。在当前的列表页面(父级页面)中接收，并且重新请求接口获取全新的整个 tableData 数据。
而不是通过监听 Reset弹窗 中用户设置的结果去手动更新父级页面 tableData 中对应的记录。