Vue v-for Cannot read property ‘xxx‘ of null

问题

今天用vue渲染个列表,可发现怎么也渲染不出来。

F12打开控制台 发现 有报错 Cannot read property 'xxx' of null

前端我用的标签是

v-for="(problem, index) in xfwtxsgzlb"

报Cannot read property 'problem' of null

排查

于是排查后端返回,奇怪了,返回了5条数据啊,怎么会null呢

然后console.log 打印 ,也能打印出值啊,更奇怪了!

原因

后来仔细排查发现返回的5条数据后面还有一条 值为null。好了,

原因找到了,就是一共返回了6条,其中一条为null。

找到问题了就好解决了。

解决

一,后端解决,返回数据时过滤掉为null的数据,这是正经的解决方式。

二,前端解决,v-for那个标签里面在包一层,如下图

Vue v-for Cannot read property ‘xxx‘ of null

但这样有个弊端,如有分页逻辑的话条数会有不准,因为你过滤掉了为null的那一条。对与后端来说它是一条正经的数据,所以最好还是后端解决吧。

看网上好多帖子都说 v-for 后面跟个 v-if 可是我这么写 提示语法错误。

上一篇:matlab双曲函数


下一篇:学习Spring遇Configuration problem: Cannot locate BeanDefinitionDecorator for element [component-scan]问题