我本想通过有道翻译一些句子，没想到上来就不显示，我还以为是兼容性有问题呢，一看控制台居然报错了
根据打印的信息来看是个空指针异常
分析该调用栈，它是向获取一个组件的emitOptions，这个函数是vue3.0的事件声明方式，而且下面属性的监听使用的也都是Proxy
上述代码确实不足以报错，又调试了第二遍，发现t.component在第二次执行的时候会变为空值，而这就引发了null.emitsOptions，必然是报错的。
为什么是第二遍才报错呢
我们看首图可知，翻译框是由两部分组成分别是左侧原文和右侧译文，那么我们走第一遍时处理的就是左侧原文，而进行第二次处理时，走的的就右侧，但是右侧的数据还没加载完毕导致获取这个组件的时候还没生成或进行了其它判断，导致组件的初始化异常或执行异常(以上纯属个人猜测)
这个t是什么呢
查看调用栈，t表示的是一个虚拟dom,是一个叫做VoicePlayer的组件，根据翻译表示的是语音播放器。看来又是哪位大神写的了。
如果想继续排查我们需要返回到父节点
组件获取不到大概率也是父组件的问题。使用 t.ctx.parent可以获取父节点信息。父节点是一个文本组件，叫做TextTranslate
父节点包含了 VoicePlayer组件，看着还行，估计使用的是options+setup的混合写法。
这是该组件的setup函数
未完待续。。。
根据这篇博客分析CSDN博主，可能存在的原因有三种
分别是
| 情景 | 解释 | 解决方案 |
|---|---|---|
| ① v-if 导致 | 在 v-if 值为 false 时，如果操作了 v-if 控制的 DOM，可能会因为该 DOM 元素不存在而报错。 | v-show 替换 v-if |
| ② el-dialog 组件导致 | 默认弹框是关闭的，DOM中没有弹框中的内容。打开弹框再关闭后，弹框中的 DOM 元素没有被销毁，可能会因为不该存在的 DOM 元素而报错（我的报错就是由此导致）。 | 给 el-dialog 组件增加 destroy-on-close 属性 |
| ③ el-table 组件导致 | el-table-column渲染时报错，若 scope.row.xx（xx为任意字段值）不存在，对其直接执行 length、toString() 等方法而报错。 | scope.row.xx?.length |
