在项目实战中,我在vue-router踩的坑,和我的发现,深入探索vue-router底层实现

Z时代
2024-01-10
分类：综合

vue

关于vue-router的一些发现

先说结论:name重名导致路由匹配错误

OneNote中的记录

关于这个问题我的思考和探索过程

首先,我能想到的就是无论vue-router内部是怎么处理的,最后在通过路由对象匹配对应组件的时候,name的优先级会高于path,这一点是显而易见的因为一开始我this.$router.push('string')中写的path是没错的,如果path优先级高于name,我就不会发现我那个很二的错误,也就不会有这篇文章了

贴出一张Call Stack的截图证实我的猜测

其次,我在this.$router.push('string')时,我push的是一个字符串而不是一个对象,我们都知道,vue-router是在我们初始化组件的时候,准确的说是beforeCreated的时候会为我们初始化路由对象的,路由对象有唯一映射的component,但是我只传入了一个string而已,他怎么知道我想跳转到哪个路由对象,理所当然的我就想到了可能vue-router内部会根据我传入的string去匹配内部的一个路由对象池,或者说构造一个路由对象(很快构造对象这个结论就被师兄否定了,仔细思考后,这个想法确实是有缺偏颇)