我在使用vue前端代码的时候，有一个需求是要根据数据格式展示的方式动态的展示数据：
例如：
普通的字符串，直接输出
json格式，进行json解析，将json字符串解析成为json对象，存储在json对象数组里面渲染展示
…

但是问题出现了，跟着代码看：

1. 我首先调用queryTableStruct()获取到表的结构，然后前端会动态的渲染页面结构。
2. 然后会去调用后台接口，获取到数据
3. 根据数据的展示格式，如果是json展示的，进行解析存储渲染。由于可能存在一条记录里面存在多个json格式的数据需要展示。我这边想到的思路是将json字符串进行解析，然后以键值对存储在一个对象(fmtBody)里面，页面去拿这个对象(fmtBody)里面的数据，进行渲染
   

一些都进行的很好，但是在数据渲染就出现问题了。通过控制台打印对象(fmtBody)是有值的，但是前端就是不显示数据，然后通过修改页面的数据，出发vue项目的热部署之后，又出现数据了

这个困扰了我很久，一直在查这个问题是什么，还以为出现什么bug了。后来找到了这篇博文：Vue-给data数据中对象新增属性（使用Vue.$set()），并触发视图更新，解决了我的疑问

如果在实例创建之后添加新的属性到实例上，它不会触发视图更新。

而我的页面早就创建了，页面初始化的fmtBody是一个空对象，后续再往fmtBody对象里面增加键值对。这样问题就对象了，解决方案是将

this.fmtBodys[fmtBodyKey] = fmtBody

改成

this.$set(this.fmtBodys,data[i].attr,fmtBody)

这样就可以解决了

具体的问题请看上面具体博文，这里记录一个解决方案。