outlet的理解

outlet是佔位符,也就是說解析地址實際上是把組件裝到佔位符裏面去

outlet分爲兩種 一種是默認出口 一種是指定出口

<div class='left' style='border:1px solid #000;flex:1'>
        <router-outlet name='parentLeft'></router-outlet>
    </div>
    <div class='main' style='border:1px solid #000;flex:1'>
        <router-outlet ></router-outlet>
    </div>
    <div class='right' style='border:1px solid #000;flex:1'>
        <router-outlet name='parentRight'></router-outlet>
    </div>
</div>
{component:ParentComponent,path:'parent',children:[
      {component:MainComponent,path:'main'},
      {component:ChildLeftComponent,path:'left',outlet:'parentLeft'},
     {component:ChildRightComponent,path:'right',outlet:'parentRight'}
    ]}

同時把三個組件,放入到對應的佔位符裏面去,url應該這麼寫parent/(main//parentLeft:left//parentRight:right)

要想把一個組件既能夠放進主佔位符,又能夠放進左佔位符,右佔位符,路由應該這麼寫

{component:ChildLeftComponent,path:'left'},
{component:ChildLeftComponent,path:'left',outlet:'parentRight'},
{component:ChildLeftComponent,path:'left',outlet:'parentLeft'},
相關文章
相關標籤/搜索