位置: IT常识 - 正文
web前端Vue 报错：Uncaught (in promise) TypeError: Cannot read properties of nu(vue jsx报错)
编辑：rootadmin推荐整理分享web前端Vue 报错：Uncaught (in promise) TypeError: Cannot read properties of nu(vue jsx报错)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:vue jsx报错,前端使用vue,vue错误提示,vue前端出现400错误,vue前端出现400错误,前端构建后vue页面显示乱码,前端构建后vue页面显示乱码,前端构建后vue页面显示乱码,内容如对您有帮助，希望把文章链接给更多的朋友！
最近在写vue项目 在写自定义分页器的时候报了一个异常 知道错误却一直找不到解决方案 苦思冥想后 还是js的基础语法不扎实导致的，在此记录一下解决方案和思路 为以后的bug解决之路打下基础
错误提示错误内容Uncaught (in promise) TypeError: Cannot read properties of null (reading 'length')
错误截图如下：
BUG分析此bug大概是说我写的一句语法，它没有找到length这个方法 我们都知道java中只有集合和数组才有size和length这种方法 在vue语法中也同样支持数组语法，既然它说找不到那就是，这不是一个数字结构！
下面是我代码中的源代码 <div v-if="item.disease.length > 4 ? true:false"> <a style="pointer-events: none; color: #C8DBF2;" @click="addDisease(item,index)">+添加症状</a> </div>问题就出在item.disease.length > 4 ? true:false这句三目表达式上 item.disease可能不是一个数组，比如item.disease这个对象为空 这样一来item.disease就没有.length这个方法了…
BUG解决根据上述的分析，我们可以多加一层判断 先判空再写三目表达式，语法我们改为下面这样子 先判空 item.disease!=null
<div v-if="item.disease!=null && item.disease.length > 4 ? true:false"> <a style="pointer-events: none; color: #C8DBF2;" @click="addDisease(item,index)">+添加症状</a>如此这个分页器就完成了 没bug了~
总结学习之路 永无止步 记录当下，保持一颗向上的心态~!
上一篇：开机自动进入安全模式无法退出怎么办(开机自动进入安装模式)
下一篇：动态路由协议RIP的详细配置全过程(动态路由协议rip配置实验心得)
