Vue父组件传参数给子组件时,页面崩溃或者报undefined或者数据为空或者执行了两遍
Vue父组件传参数给子组件时,页面崩溃或者报undefined或者数据为空或者执行了两遍1. 原因请求是异步的,当父组件开始请求数据的时候,数据还在请求中的时候子组件已经渲染完毕,所以这个时候的子组件数据是空的,并且使用数据对象里面的某个值时会报undefined。而当父组件的数据请求完毕,把数据发给子组件时,子数据监听到数据发生了变化,所以数据又接收了一遍,又渲染了一遍。2、解决方案在JavaS
·
Vue父组件传参数给子组件时,页面崩溃或者报undefined或者数据为空或者执行了两遍
1. 原因
- 请求是异步的,当父组件开始请求数据的时候,数据还在请求中的时候子组件已经渲染完毕,所以这个时候的子组件数据是空的,并且使用数据对象里面的某个值时会报undefined。
- 而当父组件的数据请求完毕,把数据发给子组件时,子数据监听到数据发生了变化,所以数据又接收了一遍,又渲染了一遍。
2、解决方案
-
在JavaScript中判断这个参数的长度或类型,当参数长度>0或者类型不为undefind的时候执行相对应操作。
if(this.commentInfo.length > 0) return this.commentInfo.user.uname
-
在html中进行v-if判断,当条件符合时才开始渲染
<div v-if="commentInfo.length > 0"> <div class="detail-comment"> ... </div> </div>
更多推荐
已为社区贡献6条内容
所有评论(0)