前言

在VUE项目开发过程中，遇到一个很奇怪的表单赋值问题，赋值为生效，而当遇到下拉框切换时，上一个值显示出来了。

定位问题

1、在data中只定一个formData对象，其中有20多个表单项未定义
2、当后端数据返回时，前端直接赋值，未生效，采用$forceupdate()解决了问题
3、但是又偶然遇到另一个问题，就是必须下拉框变化时才更新数据。

原因

原因：如果在实例创建之后添加新的属性到实例上（赋值），它不会触发视图更新。
由此Vue实例创建时，表单属性名并未声明，因此Vue就无法对属性执行 getter/setter 转化过程，导致表单属性不是响应式的，因此无法触发视图更新。

解决方案：

第一种：

可以通过显示声明表单这个对象的属性来解决。

第二种：

将$forceupdate()改成$set()进行赋值

例如：this.$set(obj, key, value)