Vue router-view and transition

原创
2023/02/22 11:35
阅读数 66

used in layout,like head,body,foot,and body will be replaced by different content

config the component in router.ts.add children element.

router.ts

import LayoutPopup from '@/components/layout/index_popup.vue'
{
      path : '/xx/auth/' ,
      component : LayoutPopup ,
      children : [
        {
          path : 'xxxx1111' ,
          name : 'xxxx1111' ,
          meta : { title : 'xxxxx' } ,
          component : () => import( '@/views/xxx/xxxx1111/xxxx1111.vue' )  
        }
}
----------------------
index_popup.vue
< template >
  <div class = "dc-wrapper" >
    < Header ></ Header >
    <div class = "dc-main-container" >
      <div class = "dc-column -main" >
        < AppMain / >
      </div>
    </div>
    < Footer ></ Footer >
  </div>
</ template >
import AppMain from './main/app-main.vue'
-----------------------------
app-main.vue
< template >
  <transition>
    <router-view / >
  </transition>
</ template >
展开阅读全文
加载中
点击引领话题📣 发布并加入讨论🔥
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部