Vue父组件传给子组件数据,子组件得不到数据解决方法

2024-04-14  本文已影响0人  小李不小

父组件向子组件传数据,子组件无法的得到对应数据,也就是子组件console.log(this.dataPicture)打印得不到数据

https://blog.csdn.net/m0_49714202/article/details/125910716

第一种方案

(1)数据为 数组 时候

当父组件是要传给子组件的数据为 数组 的时候 用数组判断大于0,加在挂载父组件上的子组件上面
v-if=“dataPictureList.length >0” 按钮如下

父组件

<homePicture :dataPicture='dataPictureList' v-if="dataPictureList.length >0">

data () {
return {
dataPictureList: [],
}
}

子组件

props: {
dataPicture: {
type: Array,
default: () => ({})
}
},

(2)数据为 对象 时候

当父组件是要传给子组件的数据为 对象 的时候 用数组判断大于0,加在挂载父组件上的子组件上面
v-if=“Object.keys(dataPictureList).length >0”
注意 :对象是 Object.keys(dataPictureList)这个大于0
数组用数组长度就行:dataPictureList.length 这个大于0

上一篇 下一篇

猜你喜欢

热点阅读