错误描述:尽管页面正常渲染了,但是仍然给我们报出一个警告。
代码如下:
// 父组件
<topic-content :tdata="topicContent"></topic-content>
//子组件
<span class="reply-count">{{tdata.replies.length}} 回复</span>
报错原因: 父组件给子组件传值,子组件渲染第二层数据的时候会报错,主要原因父组件是异步获取数据的,在没有获取到数据的时候data选项里面的空值传给子组件。
解决办法:
// 做一个判断,在没拿到数据之前不给子组件传值
<topic-content :tdata="topicContent" v-if="topicContent.author !== undefined"></topic-content>