最近在使用Vue仿写一个网易云音乐的单页面应用,当页面布局什么的写完后,然后就准备用axios获取后台数据渲染页面了,当然,我自己写的,并没有后台,所以,我就自己写json文件,然后弄proxy代理什么的。兴冲冲的搞完,在父组件获取数据然后分发到子组件,然后问题来了——报错,警告
【Vue warn】 :Error inrender:“TypeError: Cannot read property 'length' of underfined”
类似这种警告,‘ ’之内的内容各种各样,遇到问题当然要解决问题了,千方百计,绞尽脑汁,然而并没有搞定,陷入沉思
然后最后回到问题出现的源头,json 数据的获取,脑子一抽,会不会是自己写的json数据有问题啊?然后打开自己写的json数据一看
"anchor2": [ { "title": "热门主播", "more": "", "list": [ { "id": "1", "name": "陈立", "info": "心理学家", "img": "http://p1.music.126.net/p9U80ex1B1ciPFa125xV5A==/5931865232210340.jpg?param=62y62" } ] }]
上面是自己写的json数据,
然后我想获取这个数据内的list,我是怎么写的呢——this.list = data.anchor2.list ,然后警告来了
心塞啊,把json数据改正如下——
"anchor2": { "title": "热门主播", "more": "", "list": [ { "id": "1", "name": "陈立", "info": "心理学家", "img": "http://p1.music.126.net/p9U80ex1B1ciPFa125xV5A==/5931865232210340.jpg?param=62y62" } ]}
获取数据写法不变,然后获取数据成功。一个 [ ] 号 把我和获取正确数据的路阻挡了,真坑,有没有在自己写json数据上遇到类似问题的,可以吐槽一下。