开发中遇到的vue3.x 控制台出现的几种无法定位错误的警告

下面展示的几种警告相同的一点就是不知道是哪行报错，你只能知道大概是哪个组件有问题。这里分享下问题原因。【我是怎么定位错误的？一行一行删呗。。。】

警告1：

Unhandled error during execution of setup function

image.png
后面的警告都是这个引起的，修复后就没了。很明显是leftAlarmList.vue组件 setup函数中的问题，原因是leftAlarmList.vue组件引入了baseList.js，而baseList.js 未引入computed就使用了。
image.png
总结：检查报错组件setup 函数中的逻辑是否有明显错误，或者是该函数中引入的外部js | ts 文件是否有使用未定义、未引入的方法、变量问题。

警告2：

[Vue warn]: Unhandled error during execution of component event handler

image.png
翻译一下就是：执行组件事件处理程序时出现未处理的错误。这个问题我在leftAlarmList.vue组件中找了一圈都没发现病根，最后想到是不是leftAlarmList.vue组件抛出的事件在组件外报错了？也就是这个事件先从leftAlarmList.vue组件触发，然后被外部调用，外部调用报错，然后vue就抛出了警告提示我们 - 这个事件在处理过程中报错啦！快去看下！然后我在外部调用点包裹了个try catch ,果然警告没了。
总结：检查该组件事件调用过程在调用方是否报错？注意：这个多半是外部的问题，因为组件内部会直接报错而不是抛出警告。

若对你有帮助，请点个赞吧，若能打赏不胜感激，谢谢支持！
本文地址：https://www.jianshu.com/p/df8b27e65f03?v=1695278780242，转载请注明出处，谢谢。