美文网首页
命名式视图

命名式视图

作者: 有一种感动叫做丶只有你懂 | 来源:发表于2019-04-03 00:09 被阅读0次

    1.路由配置

    假设我路由配置如下

    [
      {
        path:'/home',
        component:Home,
        children:[{
            path:'/home/home-list',
            components:{
                default:HomeList,
                a:HomeAdd
            },{
                path:'/home/home-add',
                component:HomeAdd
              }
         }]
      }
    ]
    

    2.在根路由下('/home')

    <template>
      <div>
        <router-view/>
        <router-view name="a"/>
      </div>
    </template>
    

    3.在/home/home-list中的实际效果

    可以显示HomeAdd里面的内容
    //从路由配置中我们可以看出/home/home-list和/home/home-add是同级路由,但是我们在他们共同的根路由里面加了一个名字叫做a的router-view,并且在路由中增加了配置,所以当路由匹配到'/home/home-list'的时候HomeAdd这个组件也会被显示出来,显示出来的位置取决于在根路由里面的位置

    相关文章

      网友评论

          本文标题:命名式视图

          本文链接:https://www.haomeiwen.com/subject/tqsobqtx.html