wip

Author: yyx990803

src/directives/view.js

@@ -39,15 +39,25 @@ export default function (Vue) {
       let router = this.router = route.router
       router._views.unshift(this)
 
-      // note the views are in reverse order.
-      let parentView = router._views[1]
+      // locate the parent view
+      let parentView
+      let parent = this.vm
+      while (parent) {
+        if (parent._routerView) {
+          parentView = parent._routerView
+          break
+        }
+        parent = parent.$parent
+      }
       if (parentView) {
         // register self as a child of the parent view,
         // instead of activating now. This is so that the
         // child's activate hook is called after the
         // parent's has resolved.
         this.parentView = parentView
         parentView.childView = this
+      } else {
+        router._rootView = this
       }
 
       // handle late-rendered view

src/pipeline.js

@@ -159,8 +159,12 @@ export function activate (view, transition, depth, cb, reuse) {
     component = view.build({
       _meta: {
         $loadingRouteData: loading
+      },
+      created () {
+        this._routerView = view
       }
     })
+
     // handle keep-alive.
     // when a kept-alive child vm is restored, we need to
     // add its cached child views into the router's view list,

src/transition.js

@@ -29,7 +29,12 @@ export default class RouteTransition {
     // the deactivate queue is an array of router-view
     // directive instances that need to be deactivated,
     // deepest first.
-    this.deactivateQueue = router._views
+    let view = router._rootView
+    this.deactivateQueue = router._views = []
+    while (view) {
+      this.deactivateQueue.unshift(view)
+      view = view.childView
+    }
 
     // check the default handler of the deepest match
     let matched = to.matched