vue TypeError: Cannot read property 'length' of undefined 问题解决思路
上图中是我在接手一个项目的时候,出现的一个关于数组的 bug,但是从上图来看,其实报错是不清楚的,只能从报错信息上看出来是 /src/page/waybill/waybill_form.vue 这个 vue 页面出现的报错。
如果遇到这种情况,很多人会很难下手,也不知道怎么处理。
下面是我的处理这种模糊问题的处理思路。(注释排除法)
一、排除 js 内的 所有的xxx.length 的 变量是否是数组类型。
二、排除 html 代码上是否引用过xxx.length 。
如果以上注释了排除还是报错的话。
还需要关注的就是 v-for ,因为代码再执行到 v-for="(item,index) in arry" 这里时,如果arry不是个数组就会导致报错 xxxx.length 找不到,因为渲染的时候会内部运行 for 循环就会用到 xxx.length。这个是不能很快直观的能处理到的隐藏问题。
以上就是我处理这种报错模糊,并且项目不是自己一手写的,上一个开发人又不在的时候,的处理问题的一个思路
vue TypeError: Cannot read property 'length' of undefined 问题解决思路的更多相关文章
- vue v-if:"TypeError: Cannot read property 'length' of undefined"
在使用v-if判断一个数组大小为0时,会出现 length 是undefined的错误:[Vue warn]: Error in render: "TypeError: Cannot rea ...
- easyui Datagrid查询报错Uncaught TypeError:Cannot read property 'length' of undefined
1.问题描述 easyui中datagrid执行loadData方法出现如下异常:Cannot read property 'length' of undefined 2.一开始怀疑是js或者页面的问 ...
- laydate 日期格式为yyyy 或yyyy-MM时,出现错误Uncaught TypeError: Cannot read property 'length' of undefined
这个改起比较麻烦,没有深究,简单兼容了yyyy 和yyyy-MM,其他格式可能还是会有错误.替换Dates.check方法. //检测日期是否合法 Dates.check = function(){ ...
- easyUI Uncaught TypeError: Cannot read property 'length' of undefined
dataGrid json 封装数据格式为 List<Object> 格式
- vue.common.js?e881:433 TypeError: Cannot read property 'nodeName' of undefined
我觉得吧,是这么个原因,就是响应式要找这个node改它的内容,没找着,就报错了. 用computed监控vuex的state属性,绑定到页面上,如果这个属性改了,因为响应式,那么就要更改页面,如果页面 ...
- vue项目使用echarts按需引入实现地图动态显示效果时,报错:TypeError: Cannot read property 'dataToPoint' of undefined
vue项目使用echarts按需引入实现地图动态显示效果时,报错:TypeError: Cannot read property 'dataToPoint' of undefined 借鉴了该大神的文 ...
- VUE.JS 使用axios数据请求时数据绑定时 报错 TypeError: Cannot set property 'xxxx' of undefined 的解决办法
正常情况下在data里面都有做了定义 在函数里面进行赋值 这时候你运行时会发现,数据可以请求到,但是会报错 TypeError: Cannot set property 'listgroup' of ...
- vue表单校验提交报错TypeError: Cannot read property 'validate' of undefined
TypeError: Cannot read property 'validate' of undefined at VueComponent.submitForm (plat_users.html: ...
- Vue使用Typescript开发编译时提示“ERROR in ./src/main.ts Module build failed: TypeError: Cannot read property 'afterCompile' of undefined”的解决方法
使用Typescript开发Vue,一切准备就绪.但npm start 时,提示“ ERROR in ./src/main.tsModule build failed: TypeError: Cann ...
随机推荐
- 【贪心】 Codeforces Round #419 (Div. 1) A. Karen and Game
容易发现,删除的顺序不影响答案. 所以可以随便删. 如果行数大于列数,就先删列:否则先删行. #include<cstdio> #include<algorithm> usin ...
- Spring的Bean生命周期理解
首先,在经历过很多次的面试之后,一直不能很好的叙述关于springbean的生命周期这个概念.今日对于springBean的生命周期进行一个总结. 一.springBean的生命周期: 如下图所示: ...
- 动态改变Android控件大小
Button button = (Button) findViewById(R.id.button2);button.setOnClickListener(myOnClickListener); // ...
- 【spring cloud】spring cloud中启动eureka集群时候,发生端口已经绑定的报错The Tomcat connector configured to listen on port 8000 failed to start. The port may already be in use or the connector may be misconfigured.
在分别设置 进行微服务eureka集群启动时候,执行命令行启动jar包时候,报错前面一个端口8000已经被使用,而我这里启动的配置文件中端口号是8001,怎么会导致端口冲突呢?? 但是报错我的端口冲突 ...
- vue项目中使用地图组件
一.引入高德地图 一般用使用vue-cli webpack最简单粗暴的引入地图api的方法就是,在入口index.html的头部直接引入,记得一定要带上key,如果没有的话去高德地图api的官网申请一 ...
- Spring 自定义配置类bean
<!-- 引入配置文件 --> <bean id="propertyConfigurer" class="org.springframework.bea ...
- linux经常使用文字处理命令总结
linux grep命令 作用 Linux系统中grep命令是一种强大的文本搜索工具,它能使用正則表達式搜索文本,并把匹 配的行打印出来.grep全称是Global Regular Expressio ...
- [Algorithm] Fibonacci problem by using Dynamic programming
vThere are three ways to solve Fibonacci problem Recursion Memoize Bottom-up 'First Recursion approa ...
- [ES6] 07. Default Value for function param
Normally, we can set default value for function param: //Here use "Hello" as default param ...
- EffectiveJava(26)使用泛型类替代普通类
使用泛型编写类比使用需要在客户端代码中进行转换的类型更加安全,并且对去其他程序员来说更加容易扩展,我们应该将可以用泛型代替的非泛型类优化 那么,如何将类泛型化呢? 这很简单.首先,给他的声明添加一个或 ...