页面局部刷新的时候由有数据到无数据时候失败

发源地

在项目中突然发现没有分析结果的的数据突然出现了结果,然后到上级页面时候发现他的状态依旧是未分析

验证方式

在数据库中验证结果也是未分析,页面数据有出入

寻源步骤

1、 再次打开该条数据,发现数据正常了(为未分析),bug自己消失了?
2、回忆上次出现场景(为有数据到无数据的过程中发现),然后重复上次步骤,发现他又出现了
3、寻找是接口原因还是页面展示原因(此时就需要使用强大的“F12”了),发现接口返回数据是正常的
4、然后在前端添加打印事件,发现是新数据更新的时候没有数据就没有将原来的数据替换掉,依旧展示的是原来的数据

排查原因

在经过以上步骤之后发现异常出现在 

Object.assign(imgData, res.data)

这一句里面,替换成

imgData.diagnosis = res.data.diagnosis || []

之后就没有以上问题了

查询资料

Object.assign() 静态方法将一个或者多个源对象中所有可枚举自有属性复制到目标对象,并返回修改后的目标对象。

  语法

Object.assign(target, ...sources)

注释

target 需要应用源对象属性的目标对象,修改后将作为返回值。

sources 一个或多个包含要应用的属性的源对象。

返回值  修改之后的目标对象

特殊情况

1、 如果目标对象与源对象具有相同的键(属性名)的时候,源对象中的属性会覆盖掉目标对象的属性,如果多个源对象中都有改键,那么最后保留的是最后(最右边)一个源对象键的值,

2、如果源对象没有键值对的时候,目标对象不会又任何改变

如果在局部刷新的时候有没有数据的情况的时候就需要酌情考虑  Object.assign() 的使用了

  

 

posted @ 2023-06-06 17:42  独丨恋  阅读(16)  评论(0编辑  收藏  举报