vue3 项目中出现的空白页面的总结

我遇到的空白页面的问题，不是路由懒加载的原因，是在点击路由完整的状态下，点击菜单跳转页面，出现的空白页面，不能触发页面中任何钩子函数，但是路由是跳了的，重新刷新页面，页面内容即可出现，而且空白出现率相当高。

去年和今年着手的两个项目都有出现这个问题，查空白页面的问题相当恶心，没有头绪只能一点点的删除代码排查，第一个项目当时用的技术是vue3 + element-plus，空白页出现的原因是页面在加载elementPlus的数据表格时，数据需要二次处理用到map或filter(具体是用的forEach还是filter记不清楚了)重新整合数据，用map可以避免空白，filter会导致页面有空白，具体是什么原因，也没有想清楚，解决办法是换成map循环数据就没有问题。

今年的项目中也出现了这个空白页面的问题，因为之前出过这样的问题就尽量注意了自己的写法，可以排除之前的原因了，这次出现空白页面的原因是因为我喜欢每个页面在template的第一级先写个注释，

像截图这样，也是翻了很多文章才知道，template中必须有且只有一个一级节点，这句话中节点也包括注释语句，哈哈哈哈~~~，万万没想到！

将代码结构中的注释，调换至一级节点div中即可修复空白。