今天写一个实例,碰到个很神奇的问题。 我使用props传了一段json,可以正常接收,但在子组件设置数据类型后,却报这么一个错误:
Invalid prop: type check failed for prop "homeSticksData". Expected Object, got Array.
我百思不得其解,百度半天也没找着答案。
迫于无奈,只能请教同事了。
没想到,答案竟是……这样。
首先,因为上述错误,告诉我,明明系统检测数据是个array,我为什么要设一个object?
在请教之前,我先将数据设置为array,这时候错误就变成expected array, got object了,也就是所谓的系统检测是个object,我为毛要设定一个array?
于是我看了一下自己写的接口,发现我所读取的属性,其实是一个数组。
那么问题来了,既然是数组,为何我设置为array,还要报错? 原来真相竟是如此之简单。
会出现这样的错误,是因为我在从接口读取数据时,初始化设置的数据类型有问题!
我是这么写的:
data () { return { homeSticksData: {} } }
我给数据设置的类型,是{},也就是json,或者说是Object,而实际上这个数据却是一个数组。这时候,就会出现上述错误。 因此,我需要将homeSticksData的数据类型,设置为数组,如下:
data () { return { homeSticksData: [] } }
回到子组件
props: { homeSticksData: array }
这样就正常了。同事说,之所以会这样,是因为我犯了一个常识性错误……在咱JS里,array本身也是一个对象。