web前端Vue 报错：Uncaught (in promise) TypeError: Cannot read properti

前言

迩来在写vue项目 在写自界说分页器的时间报了一个非常 知道错误却不停找不到办理方案
苦思冥想后 照旧js的底子语法不踏实导致的，在此记载一下办理方案和思绪
为以后的bug办理之路打下底子
错误提示

错误内容Uncaught (in promise) TypeError: Cannot read properties of null (reading 'length')
错误截图如下：

BUG分析

此bug大概是说我写的一句语法，它没有找到length这个方法
我们都知道java中只有聚集和数组才有size和length这种方法
在vue语法中也同样支持数组语法，既然它说找不到那就是，这不是一个数字布局！

• 下面是我代码中的源代码
  

1. <div v-if="item.disease.length > 4 ? true:false">
2. <a style="pointer-events: none; color: #C8DBF2;"
3. @click="addDisease(item,index)">+添加症状</a> </div>

复制代码

题目就出在item.disease.length > 4 ? true:false这句三目表达式上
item.disease大概不是一个数组，比如item.disease这个对象为空
这样一来item.disease就没有.length这个方法了…
BUG办理

根据上述的分析，我们可以多加一层判断
先判空再写三目表达式，语法我们改为下面这样子 先判空 item.disease!=null

1. <div v-if="item.disease!=null && item.disease.length > 4 ? true:false">
2. <a style="pointer-events: none; color: #C8DBF2;"
3. @click="addDisease(item,index)">+添加症状</a>

复制代码

如此这个分页器就完成了 没bug了~
总结

学习之路 永无止步
记载当下，保持一颗向上的心态~!

来源：https://blog.csdn.net/Life_s/article/details/126766562
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！