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

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

拿来一段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

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

Logo

前往低代码交流专区

更多推荐