系统首页连续加载3次必白屏，控制台报“Cannot read properties of undefined (reading ‘length’)”错误，排查+修复时限2小时，无需多余流程，只看结果和排查逻辑。作为后端转全栈开发的一员，我很清楚这类间歇性白屏BUG的排查重点，没有花哨的博弈描述，打开编辑器、定位代码、分析日志，就是最直接的应对方式。
从我角度来看，核心的是“快速定位根因”而非“盲目试错”。间歇性故障远比持续性报错棘手，持续性报错通常能直接定位到具体代码行，而这类“偶发”BUG，大概率和异步请求时序、数据返回不稳定、变量未做边界判断有关。此次报错是典型的undefined读取属性异常，结合首页加载场景，优先锁定三个排查方向：数组未初始化、异步请求返回数据异常、DOM渲染时机过早，逐一验证、排除，是最高效的思路。 
第一步先复现问题、留存关键信息。按照测试反馈的步骤，我用Chrome浏览器开启开发者工具，切换到Console和Network面板，连续刷新首页3次：前两次加载正常，Network面板中三个核心接口（导航、卡片、公告）均返回200，数据格式符合约定；第三次刷新时，页面瞬间白屏，Console面板弹出目标报错，同时Network面板显示卡片数据接口（/api/cardList）响应延迟约4秒，返回数据为空对象（res.data = undefined）。截图留存报错信息和Network日志，这是后续排查的核心依据——undefined报错，基本可以排除DOM渲染时机问题，重点转向数据请求和变量处理。
接下来进入代码排查环节，优先从高频报错模块入手，先检查轮播图渲染逻辑，因为轮播图涉及数组循环渲染，是undefined报错的高发场景，核心代码如下：
<
