vue-cli项目data中数据变化，页面列表如何展示前后数据变化？

Question

像这种异步获取的数据中数值升降，在vue-cli中如何实现？

Answer 1

这个前后变化其实需求有些分歧。

1. 用户刷新页面前后变化。
2. 类似百度这种，与用户刷新页面无关，由后端去计算升降。

第二种需求没啥讨论的，假设题主问的是第一种的话，我会这样解决：

请求到新的列表数据后，别着急绑定data，先与现有数据进行对比，将对比结果绑到新数据上，再更新至data。

---- 分隔线 ---

对于多层嵌套，也是要遍历进行对比的。
要明白你需要的上升或下降，都需要数据来体现，所以只能与上次数据进行遍历比较。

Answer 2

function diff(arr1, arr2) {
    return arr1.map((item, i) => Object.assign(item, {up: item.a < arr2[i].a}))
}
diff([{a: 1.2}, {a: 2.8}, {a: 3}], [{a: 1.5}, {a: 2}, {a: 2}])

简单diff 一下就行了，返回一个布尔类型的 up ，然后设置对应的升降图标