前言

Error in render: "TypeError: Cannot read properties of undefined (reading 'length')"
相信大家看到以上错误一定感觉很熟悉,这个错误是很多小伙伴们会经常遇到的错误,那么如果遇到这种错误如何快速定位错误呢,下面我将结合实例,为大家讲解快速定位这种错误的方法;

报错分析

在这里插入图片描述
首先看到控制台输出以上错误信息,直译过来是:不能获取正在阅读的length属性。也就是说在获取读取length属性时,读到的是undefined,往前推,就是有length属性的那个对象没有获取到。那么我们就可以直接定位错误在length前面的对象,在代码中找到与之匹配的语句如下图所示;
在这里插入图片描述
找到语句以后我们直接在控制台打印length前面的对象看看有没错误,结果发现输出undefined,如两张图所示
在这里插入图片描述
控制台
在这里插入图片描述
从以上测试分析,personList也获取不到,此时我们直接打印this,在控制台逐层查找,看看能不能找到length属性
在mounted函数内打印this后,控制台输出结果如下:
在这里插入图片描述
从控制台输出的结果可以看出,必须通过this.$store.state.personAbout.personList才能获取length属性。因此错误原因为少了personAbout,导致读取不到length属性;

快速定位错误总结

经过以上错误的分析,以后如果碰到以上的错误,直接在找==(reading ‘length’)==正在获取的属性前面的对象,直接在mounted函数内部打印,逐层找是因为哪个对象没有获取到

写在最后

🥂(❁´◡`❁)您的点赞👍➕评论📝➕收藏⭐是作者创作的最大动力🤞

Logo

前往低代码交流专区

更多推荐