描述
在用Vue的时候出现了一个令人窒息的错误
报错显示 “avatar” 未定义，但在postman中测试返回的数据确实有“avatar”，可是为什么未找到？
然后我在控制台中打印从后台获取到的数据：
{
"id": 3,
"date": "2021-01-22 21:11:32",
"organizer": {
"id": 1,
"avatar": "http://oss.norza.cn/imgs/avatar/organizer/1/avatar01.jpg",
"username": "kongsama",
"profile": "time tick away, dream faded away!",
}
}
通常情况下，在请求之后的数据会赋值给data里边的变量，data的video中没有其他字段（属性）：
data() {
retrun {
video: {}
}
}
思考
因为获取数据是异步操作，也就是页面渲染和请求操作是非同步的，页面渲染那个时候拿到的video还没有任何数据，而渲染完成之后才拿到了video数据，报错可能是数据还正在请求时发出的。
所以，将字段（属性）填充完整就可以避免Vue提示错误，字段可以选择性填充，比如在template中用哪个字段，就写哪个字段名称即可。
解决
{
"organizer": {
"avatar": "",
}
}
在template中只用到了avatar，所以我就把它上层结构也写出来。如果是数组形式的，只需要写一个结构，因为后期会被覆盖掉的。
其他方案
网上还有一种解决方法是，在渲染的那层标签外套一个v-if判断字段是否存在，
明确地告诉你，这种方法是不可行的，本来页面渲染和请求操作是非同步的，页面渲染那个时候拿到的video还没有任何数据，而渲染完成之后才拿到了video数据，
所以v-if判断的对象本身就是null值，所以也会报错！
