vue-router(2)

1.路由嵌套

在路由下面可以嵌套其他的路由,通过添加children即可,其原理还是和树状组件类似

子组件会渲染到父组件的位置,不会插入到根组件位置

同样的,不要忘记引入组件

 

新建一个测试用的vue

特别重要的一点:子组件不会在根组件中被渲染,所以一定要在其父组件中使用<router-view>引入

在地址栏输入:

成功!


7、命名的路由视图、路由重定向

具名的路由:在设定路由表的时候就给它设定一个名字,<router-link :to=”XXX”>以后在绑定这个路由的时候就可以直接使用name这个字段来指定相应的路由 


假如我们希望<router-link>是一个li,那么只需要指定tag属性等于li即可


像这样在组件<template>里面,这样的<router-link>叫做声明式导航

我们也可以在路由表所在的文件里面进行编程式的导航

比如Routers.beforEach()

A、 什么是命名的路由视图?

比如<router-viewname=”viewA></router-view>

<router-view name=”viewA></router-view>

在路由表里,给其中一个路由指定组件的时候

component:{

        viewA:Apple,

        viewB:Orange

}

B、 什么是路由重定向?

routers:[

         {

                  path: ’/’,

redirect:’/apple’

}

//当我们访问根路径的时候,会重定向到/apple

]


猜你喜欢

转载自blog.csdn.net/milan_kunderla/article/details/80027572