vue.js数据可以在页面上渲染成功却总是警告提示某个字段“undefined”未定义

问题原因：

  出问题的时机很可能就是异步调取接口获取数据和vue的生命周期mounted异步进行，在mounted已经走完，页面DOM节点已经挂载完成时，接口数据却没有第一时间一起返回并渲染，虽然在我们肉眼可观察到的时间内，数据成功渲染到了页面中，但却结结实实地给我们报了一个“属性未定义”的警告。

解决办法：

1. 需要在DOM节点挂载完成时判断初始化的数据是否存在（初始化的数据我们一般会设置为空的字符串或空的对象）。
2. 一般我们可能会把数据初始化为一个空对象或者空数组，但是有个小问题就是我们很难在页面中判断这个对象或者数组是否为空，不太好判断（因为当data为一个空对象时，v-if="data"判断出来的依然是true，等于没有判断 ），因此我们可以利用“js属于弱类型语言”这一特点，在初始化的时候就讲数据初始化为一个字符串的类型。
3. 例如：我们把初始化时设置的空对象数据 data: {} 改成了空的字符串 data: ""，然后在页面中加入 v-if="data" 的判断即可，这样只有当data有值时才开始渲染DOM节点，警告的问题就不会出现了。