在使用v-if判断一个数组大小为0时,会出现 length 是undefined的错误:
[Vue warn]: Error in render: "TypeError: Cannot read property 'length' of undefined"

错误代码:

<group v-if="item.detailEntityList.length===0" style="margin-top:-22px;">
<div style="text-align:center;font-size:14px;padding:10px 0;color:#f76260;">
暂无信息
</div>
</group>

  

造成这个错误的原因是因为,没有预先判断数组是否存在,需要先对数组进行非空验证:item.detailEntityList!=undefined

修正代码:

<group v-if="item.detailEntityList!=undefined && item.detailEntityList.length==0" style="margin-top:-22px;">
<div style="text-align:center;font-size:14px;padding:10px 0;color:#f76260;">
暂无信息
</div>
</group>

  

vue v-if:"TypeError: Cannot read property 'length' of undefined"的更多相关文章

  1. vue报错TypeError: Cannot read property 'protocol' of undefined

    错误信息如下所示: isURLSameOrigin.js?3934:57 Uncaught (in promise) TypeError: Cannot read property 'protocol ...

  2. easyui Datagrid查询报错Uncaught TypeError:Cannot read property 'length' of undefined

    1.问题描述 easyui中datagrid执行loadData方法出现如下异常:Cannot read property 'length' of undefined 2.一开始怀疑是js或者页面的问 ...

  3. vue TypeError: Cannot read property 'length' of undefined 问题解决思路

    上图中是我在接手一个项目的时候,出现的一个关于数组的 bug,但是从上图来看,其实报错是不清楚的,只能从报错信息上看出来是 /src/page/waybill/waybill_form.vue 这个 ...

  4. laydate 日期格式为yyyy 或yyyy-MM时,出现错误Uncaught TypeError: Cannot read property 'length' of undefined

    这个改起比较麻烦,没有深究,简单兼容了yyyy 和yyyy-MM,其他格式可能还是会有错误.替换Dates.check方法. //检测日期是否合法 Dates.check = function(){ ...

  5. vue报错TypeError: Cannot read property '$createElement' of undefined

    报错截图: 这个错误就是路由上的component写成了components

  6. easyUI Uncaught TypeError: Cannot read property 'length' of undefined

    dataGrid json 封装数据格式为 List<Object> 格式

  7. TypeError: Cannot read property 'compilation' of undefined

    Vue build失败 TypeError: Cannot read property 'compilation' of undefined 1.   使用npm run build 失败 使用npm ...

  8. TypeError: Cannot read property 'length' of null

    本文为博主原创,未经允许不得转载: 异常展示: [Vue warn]: Error in getter for watcher "filterAndSortData": " ...

  9. vue.common.js?e881:433 TypeError: Cannot read property 'nodeName' of undefined

    我觉得吧,是这么个原因,就是响应式要找这个node改它的内容,没找着,就报错了. 用computed监控vuex的state属性,绑定到页面上,如果这个属性改了,因为响应式,那么就要更改页面,如果页面 ...

随机推荐

  1. windows 下使用 protobuf

    下载protobuf 下载地址:https://github.com/google/protobuf/releases 选择protoc-xxx-win32.zip下载 配置环境变量 将解压出来的pr ...

  2. 搭建Sonar代码走查环境

    1.下载SonarQube并解压(查看检测结果用) 2.根据自己系统下载SonarQube Runner(检测代码用,旧版名叫Sonar Scanner) 3.在自己要检测的工程目录下建立sonar- ...

  3. spring 初始化

    一.Spring 容器高层视图 Spring 启动时读取应用程序提供的Bean配置信息,并在Spring容器中生成一份相应的Bean配置注册表,然后根据这张注册表实例化Bean,装配号Bean之间的依 ...

  4. windows下复制文件报错“文件名对目标文件夹可能过长 。您可以缩短文件名并重试,或者......”

    我将一个路径下文件夹复制到另一个路径下时,出现了报错,报错图片如下: 然后查资料发现: 1.文件名长度最大为255个英文字符,其中包括文件扩展名在内.一个汉字相当于两个英文字符.2.文件的全路径名长度 ...

  5. Ubuntu设置su和sudo为不需要密码 (摘录自别处)

    版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/langb2014/article/details/54646675 针对非服务器用户,只是用普通的U ...

  6. node+webpack+vue-cli

     安装nodejs + 安装webpack + 安装vue-cli+安装脚手架模板+安装依赖+运行 1 安装nodejs 去官网安装node.js( http://www.runoob.com/nod ...

  7. Matlab文件和数据的导入与导出

    ref: https://blog.csdn.net/zengzeyu/article/details/72530596 Matlab文件和数据的导入与导出 2017年05月19日 15:18:35  ...

  8. 5+移动App

    1.5+ App开发入门指南 https://www.cnblogs.com/tuyile006/p/5395909.html 2.5+ App开发Native.js入门指南 http://ask.d ...

  9. Emmet:HTML/CSS代码快速编写神器教程

    Emmet的前身是大名鼎鼎的Zen coding,如果你从事Web前端开发的话,对该插件一定不会陌生.它使用仿CSS选择器的语法来生成代码,大大提高了HTML/CSS代码编写的速度,比如下面的演示: ...

  10. mvc partialView+kendo window

    在写mvc项目时,一个列表查询页面含有多个操作按钮及弹框操作.原本写在了一个view中,导致代码繁多复杂,难以维护,还有表单赋值清空.验证等麻烦. 因此改用kendo window +partialV ...