想法一:response数据返回有误
针对这个想法,我console了下response,发现response返回正常,此想法被终结。
想法二:既然response返回没有问题,那问题难道出在data上?
针对这个想法,我console了下response.data,发现response.data返回正常,返回的数据正是我接口中的数据!
验证完这两个想法之后,我有点迷糊了,既然data没有问题,为什么获取不到内部的数据呢?带着这个问题,我去GOOGLE了一把,发现vue-resource的GET方法返回的response不仅仅只是单纯的数据,而是包含了请求头信息,数据等等一系列的数据,而vue-response也提供了提取数据的方法:response.json()。感觉抓到救命稻草的我迫不及待的试用的这个方法去获取数据,结果依旧无法获取。
想法三:既然response.json()无法获取,应该有其他的方法可以获取到。
为此,我又去参考了相应的文档,发现确实还有一个方法:response.body.data!如蒙大赦,天不亡我!
然。。。依旧失败。多次的尝试无果,略有烦躁,恰巧这个时候,同事问了我一个问题,也是接口的数据获取不到,只不过是用的$.ajax的方法,后来发现是未定义dataType:JSON的问题。说到这儿,醍醐灌顶!是不是一开始,data返回的就不是JSON格式,而是字符串的格式?于是,我在最开始获取数据的方式外,加了一层JSON.parse:
this.articles = JSON.parse(response.data).data.list;满怀期待的看着控制台,终于,获取到数据。
结论:综上所述,在使用vue-resource时,需要留意最终获取的数据是否为JSON格式,如若不是,需要先进行JSON格式化才可以。vue-resource是否有设置dataType的入口,本人才疏学浅,还未得知,以后如果发现,定会告知。如有大神看到,希望不吝赐教OTZ~










