解决Cannot read properties of undefined (...)类型的报错

最新推荐文章于 2025-03-07 22:43:24 发布

啵啵啵啵猫

最新推荐文章于 2025-03-07 22:43:24 发布

阅读量10w+

点赞数 6

分类专栏： bug集合文章标签： javascript 前端开发语言 vue

本文链接：https://blog.csdn.net/qq_51978639/article/details/128827591

版权

bug集合专栏收录该内容

7 篇文章

订阅专栏

在处理项目中的mouseover事件时，遇到Cannotreadpropertiesofundefined(readinggrid3D)错误。问题源于尝试访问未定义的对象属性。解决方案是检查this.option是否已正确初始化，避免使用this，直接引用option变量。通过console.log找出option为undefined的原因，发现无需使用this，修改代码后问题得到解决。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

场景：

在项目中，想要获取鼠标的元素，红色区域报错：Cannot read properties of undefined (reading 'grid3D')

分析：

Cannot read properties of undefined类型的报错，一般是报错元素的前一个元素出了问题，也就是this.option没有获取到。

报错类型一般为两种：

对象没值的时候
对象为undefined的时候

对象没有数据的时候为undefined 这个时候访问内部内容就会报错

解决方法：

查看一下this.option，注释掉问题代码，并输入console.log(this.option)

let option = xxx;
this.rateChart.on("mouseover", (params) => {
        // console.log('params',params);
        if (params.target) {
          // console.log("非空白区");
        } else {
        //  console.log("空白区");
          console.log(this.option) 
          // this.option.grid3D.viewControl.alpha =20; // 视角绕 x 轴，即上下旋转的角度
          // this.option.grid3D.viewControl.beta = 70; // 视角绕 y 轴，即左右旋转的角度。
          // this.rateChart.setOption(this.option);
        }
});

发现输出undefined，说明没有找到option，查看上下文，发现前面已经定义了option，不需要用this，直接使用即可。

修改后：