关于vue嵌套路由路径斜杆/问题的探究

又到了“/”时刻，是不是有些激动 。。。

众所周知，路径前加/代表跟路径，绝对路径，不加斜杠是相对路径。

拿来一段vue路由嵌套代码，让我们搞一搞它的“/”

{
      path:'/home',
      name:'Home',
      redirect:'/index',
      component:home,
      children:[{
        path:'/index',
        name: 'Index',
        component: Index,
        meta:{
          requireAuth:true
        }
      }]
    },

1.首先对于根组件上的path

如果为/home，着在浏览器地址栏输入 http://localhost:8080/home 就能直接访问

如果为home(不加/)呢，着在浏览器地址栏输入 http://localhost:8080/home 可以直接访问到吗？

答案是：不可以。原因是，不加/代表相对路径，它的相对位置在哪，我也不知道，但这里不是/

所以记着，这个路径前面一定要加“/”

2.其次根组件上的redirect

这个加不加“/”都一样，因为默认是加上的，redirect为重定向，默认使用绝对路径

3.子组件里面的path（只要能访问到子组件，父组件就会被渲染出来）

同样的如果其值为：/index代表绝对路径，通过浏览器http://localhost:8080/index 可以直接访问到

如果是 index(不加/) 呢 ，它代表是相对路径，那相对于谁呢，当然是父组件了。因此，如果你想访问次子组件就要这样访问 http://localhost:8080/home/index

这是我个人理解，如果有不对的点，欢迎大家指出