更新数组对象中的某个属性

比如你有个数组对象，想要修改某元素的值：

如果你直接赋值，

$current_all_lessons[0] = res

那么是没有效果的，视图并没有渲染，因为javascript的限制，Vue不能检测数组和对象的变化（相关说明见下）。这时候可以使用静态方法set来更新属性：

import Vue from 'vue'
...
Vue.set('$current_all_lessons[0]', 'progress_of_practice', res.progress_of_practice)

但如果还有更多数组项或者属性要修改呢，那就有点儿烦了，此时一句话就可以解决此类问题：

$current_all_lessons[0] = res
$current_all_lessons = JSON.parse(JSON.stringify(state.$current_all_lessons))

直接把修改后的对象转成json字符串，再转换回来，这样对象就成全新的了，赋值之后，全部数据得以刷新。

另外，如果只更新一个，那么使用splice也行：

let idx = $current_all_lessons.findIndex(item => item.id == id)
$current_all_lessons.splice(idx, 1, res)

缺点

影响性能！如果对象过大，渲染时间就很长，影响用户体验，毕竟这是更新所有数据，切记。

但如果数组小，属性也少，那就方便极，包括未来的各种属性名称或者属性添加删除都可以更新！

参考

想了解更多属性更新的知识，参考vue中关于属性更新-深入响应式原理：

https://cn.vuejs.org/v2/guide/reactivity.html

我是@爱玩的安哥，关注我获取更多有用知识