vue中数组变异方法push动态添加数据时视图不更新

如题所述

vue 中,数组动态push对象时正常情况是可以更新视图的,犯了一个错误,记录一下总结就是: 注意数据是否为响应式数据
最常见场景: form 表单中有一组动态增删数据的列表,如图示:

在编辑的时候,拿到接口返回的值时,错误的做法: 使得问题列表 smQuestionList 失去了响应式数据的性质,即 data 中没有了,而是重新通过 . 添加的

这样在调用新增的时候,通过 vue-Devtool 看到数据增加了,但视图却没有更新,当时没考虑那么多直接使用了强制刷新 DOM — this.$forceUpdate() ,事后想着还是不对劲,反复看了一下才发现是因为数据没有响应式,给 form 赋值注意按照即可

记录一下

温馨提示:答案为网友推荐,仅供参考
相似回答
大家正在搜