Vue3小问题记录_切换页面无法正常加载

        写作业的时候遇到了这个错误不止一次，遂记录下来

Vue3无法加载页面，报错“Maximum call stack size exceeded”，与路由有关的原因

错误记录和结局过程

        在用pure-admin的Vue3前端项目写一个作业，写着写着突然发现点击到一个页面没法加载，表现为：

1.点击菜单栏时，页面和url没有变化，仍然为之前的页面

2.输入对应url后，一直加载不出来

         查看控制台，发现报错“Maximum call stack size exceeded”，看起来是栈溢出的问题，但是在这期间我没有改页面内的内容，且报错提示的是“vue-router”，就检查了一下router对应的模块，

        发现“name”属性的名字写成了小写。。。改成大写以后就可以了，至于具体是为什么，有机会再研究吧，作业写不完了（）（）

解决方法

        router对应的name改成大写开头

切换页面后无法加载，必须刷新才能正常显示

错误记录

        在写作业的时候发现在导航栏切换页面后页面一片空白，刷新以后才能正常显示。

        研究了几次没有找到原因，跟后端对接的时候，后端的同学下了代码跑，发现了几个warn，（而我因为经常有无关紧要的warn，一直在控制台关掉了监控warn）（实际上还有另一个warn,也尝试了解决另一个warn，发现没有影响。）

 

           根据第二个warn，找到了原因——template里没有用一个最大的div包裹。其实这个问题我之前遇到过，但是当时没有记下来，就忘了。。启示是随时记录遇到的问题，还有多看控制台

解决方法

        每个页面的template都用div包裹其余所有代码

<template>
    <div>
.......业务代码
    </div>
</template>