Skip to content
Permalink
Browse files

fix(vue): use direction type from core (#17901)

  • Loading branch information...
michaeltintiuc authored and mhartington committed Apr 8, 2019
1 parent d87170d commit fa1317359a0a15b29732223e40134ce4a1443e02
Showing with 17 additions and 15 deletions.
  1. +4 −3 vue/src/components/ion-vue-router.ts
  2. +4 −3 vue/src/interfaces.ts
  3. +9 −9 vue/src/router.ts
@@ -1,4 +1,5 @@
import Vue, { CreateElement, RenderContext, VNodeData } from 'vue';
import { NavDirection } from '@ionic/core';

type TransitionDone = () => void;
interface Props {
@@ -69,7 +70,7 @@ function catchIonicGoBack(parent: Vue, event: Event): void {
let defaultHref: string;

// Explicitly override router direction to always trigger a back transition
$router.directionOverride = -1;
$router.directionOverride = 'back';

// If we can go back - do so
if ($router.canGoBack()) {
@@ -127,8 +128,8 @@ function transition(parent: Vue, props: Props, leavingEl: HTMLElement) {
return ionRouterOutlet.componentOnReady().then((el: HTMLIonRouterOutletElement) => {
return el.commit(enteringEl, leavingEl, {
deepWait: true,
duration: !props.animated ? 0 : undefined,
direction: parent.$router.direction === 1 ? 'forward' : 'back',
duration: !props.animated || parent.$router.direction === 'root' ? 0 : undefined,
direction: parent.$router.direction as NavDirection,
showGoBack: parent.$router.canGoBack(),
});
}).catch(console.error);
@@ -1,11 +1,12 @@
import Vue from 'vue';
import VueRouter from 'vue-router';
import { RouterDirection } from '@ionic/core';
import { RouterOptions } from 'vue-router/types/router';

declare module 'vue-router/types/router' {
interface VueRouter {
direction: number;
directionOverride: number | null;
direction: RouterDirection;
directionOverride: RouterDirection | null;
transition: Promise<void>;
canGoBack(): boolean;
}
@@ -61,7 +62,7 @@ export interface ApiCache {
}

export interface RouterArgs extends RouterOptions {
direction?: number;
direction?: RouterDirection;
viewCount?: number;
}

@@ -2,12 +2,12 @@ import VueRouter, { Route } from 'vue-router';
import { PluginFunction } from 'vue';
import { RouterArgs } from './interfaces';
import IonVueRouter from './components/ion-vue-router';
import { BackButtonEvent } from '@ionic/core';
import { BackButtonEvent, RouterDirection } from '@ionic/core';

// Extend the official VueRouter
export default class Router extends VueRouter {
direction: number;
directionOverride: number | null;
direction: RouterDirection;
directionOverride: RouterDirection | null;
viewCount: number;
prevRouteStack: Route[];
history: any;
@@ -18,7 +18,7 @@ export default class Router extends VueRouter {
super(args);

// The direction user navigates in
this.direction = args.direction || 1;
this.direction = args.direction || 'forward';

// Override normal direction
this.directionOverride = null;
@@ -65,12 +65,12 @@ export default class Router extends VueRouter {
}

// Increment or decrement the view count
this.viewCount += this.direction;
this.viewCount += this.direction === 'back' ? -1 : 1;

// Call the original method
this.history._updateRoute(nextRoute);

// Reset direction for overrides
// Reset direction overrides
this.directionOverride = null;
};
}
@@ -81,7 +81,7 @@ export default class Router extends VueRouter {
return this.viewCount > 1 && this.currentRoute.fullPath.length > 1;
}

guessDirection(nextRoute: Route): number {
guessDirection(nextRoute: Route): RouterDirection {
if (this.prevRouteStack.length !== 0) {
const prevRoute: Route = this.prevRouteStack[this.prevRouteStack.length - 1];

@@ -93,15 +93,15 @@ export default class Router extends VueRouter {
} else {
this.prevRouteStack.pop();
}
return -1;
return 'back';
}
}

// Forward movement, push next route to stack
if (this.history.current.fullPath !== nextRoute.fullPath) {
this.prevRouteStack.push(this.history.current);
}
return 1;
return 'forward';
}
}

0 comments on commit fa13173

Please sign in to comment.
You can’t perform that action at this time.