vue中父组件通过props向子组件传异步值为空
问题:子组件在使用props接收父组件传值的时候,浏览器报错该对象未定义父组件:子组件:控制台:原因:当父组件通过 axios 获取数据,子组件使用 props 接收数据时,子组件执行 mounted 的时候,父组件的axios 还没有返回数据,而且 mounted只执行一次,这时 props 中接收的数据为空,所以在使用的使用自然会报错undefined...
·
问题:子组件在使用props接收父组件传值的时候,浏览器报错该对象未定义
父组件:
子组件:
控制台:
原因:
当父组件通过 axios 获取数据,子组件使用 props 接收数据时,子组件执行 mounted 的时候,父组件的axios 还没有返回数据,而且 mounted 只执行一次,这时 props 中接收的数据为空,所以在使用的使用自然会报错undefined
思路:
给props接收的参数一个初始空值(不知道思路问题还是啥,这个并没有解决问题)
最终解决方法:
1、使用v-if判断(亲测可用)
2、使用watch监听(未实现)watch使用场景:父组件发生数据变化,动态的传递给子组件,子组件实时刷新视图
由于浏览器报错为data.address未定义,所以只要在使用data.address的地方加上判断v-if,data.address不为空的时候才渲染
注:当props中接收的参数为数组时,判断数组长度即可,v-if="xxx.length"
更多推荐
已为社区贡献12条内容
所有评论(0)