VUE中出现 Cannot read property 'length' of undefined 的错误

**

报错 Cannot read property ‘length’ of undefined 时解决方案

**

在做项目是遇到了length的报错

在做项目时遇到了length的报错。但是不影响其他东西，只是看着飘一片红感觉很难受。

查找了一下发现出现的原因
其实是因为，后台在返回数据时是需要时间的 不管多快 都是需要时间的 但是在初始化时，并没有给一个空的数组 注意 是数组形式 所以当调用 .length 方法时 这时后台数据还没有返回回来 此时它不是数组 就会报错

解决方案

可以在整体加一个 v-if
这样当数据还没有返回时 就不会渲染 只有数据返回回来时 才会进行渲染
这样就会解决报错的问题

代码如下 代码片.

<div class="main" v-if="book.items">
 <div class="img-list" 
   v-for="list in book.items.length > 5? book.items.slice(1, 4): book.items "
   v-bind:key="list.id">
   <div class="new-img">
     <img :src="imageUrl(list)" alt="">
     <h1 class="title">{{list.title}}</h1>
   </div>
 </div>

这样就解决啦！

友情提示 报错时 看到Error in render 的问题 其实都是渲染问题噢

以上只是我个人的理解与解决方案 如果有错误 欢迎指出 本人前端小白一枚 努力在前端道路上越走越远 这是我的第一篇博客 撒花?