fix(vue): use direction type from core (#17901)
This commit is contained in:
parent
d87170db3a
commit
fa1317359a
|
@ -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,7 +93,7 @@ export default class Router extends VueRouter {
|
|||
} else {
|
||||
this.prevRouteStack.pop();
|
||||
}
|
||||
return -1;
|
||||
return 'back';
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -101,7 +101,7 @@ export default class Router extends VueRouter {
|
|||
if (this.history.current.fullPath !== nextRoute.fullPath) {
|
||||
this.prevRouteStack.push(this.history.current);
|
||||
}
|
||||
return 1;
|
||||
return 'forward';
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue