vue-router路径问题

问题

使用el-menu做了一个顶部导航栏，后面加了一个两级路径，类似于http://127.0.0.1/#/homepage/zhangsan，然后再点击导航栏，发现不能跳转到相应的页面了。

修改前的代码

navigator.vue

<el-menu-item index="index">首页</el-menu-item>
<el-menu-item index="getranklist">排行榜</el-menu-item>
<el-menu-item index="personal">个人主页</el-menu-item>

点击时，地址是http://127.0.0.1/#/index
当我在出问题的页面时地址：http://127.0.0.1/#/homepage/zhangsan，这时点击导航栏，地址：http://127.0.0.1/#/homepage/index

解决

<el-menu-item index="/index">首页</el-menu-item>
<el-menu-item index="/getranklist">排行榜</el-menu-item>
<el-menu-item index="/personal">个人主页</el-menu-item>

仅仅是加了一个/，我太难了(灬ꈍ ꈍ灬)

为什么加了一个/,就有如此大的威力呢？

/ 会跳到根路径，而不加的时候地址是默认拼接的。