在我的Angular 4应用程序上使用RouteReuseStrategy时遇到问题。实际上,当我导航时,应用程序正在减速:我改变路径的速度越慢,速度越慢。
这是我用于CustomReuseStrategy的代码:
import { ActivatedRouteSnapshot, RouteReuseStrategy, DetachedRouteHandle } from '@angular/router';
import { AuthComponent } from '../auth/auth.component';
export class CustomReuseStrategy implements RouteReuseStrategy {
handlers: { [key: string]: DetachedRouteHandle } = {};
/**
* Determines if this route (and its subtree) should be detached to be reused later.
* Fired when shouldReuseRoute returns false
* If it returns true, the method store will be fired.
* @param route current route
*/
shouldDetach(route: ActivatedRouteSnapshot): boolean {
return true;
}
/**
* Determines the action we want to do when storing a route.
* Fired when shouldDeatch returns true.
* @param route : current route
* @param handle : identifies the stored component
*/
store(route: ActivatedRouteSnapshot, handle: DetachedRouteHandle): void {
let url: string = this.getRouteIdentifier(route);
if (route.data['shouldReuseRoute']) {
this.handlers[url] = handle;
} else {
delete (this.handlers[url]);
}
}
/**
* Determines if the current route should be reused from the stored components or not.
* Fired when shouldReuseRoute returns false
* @param route current route
*/
shouldAttach(route: ActivatedRouteSnapshot): boolean {
let url: string = this.getRouteIdentifier(route);
// Reset all the stored routes if we're on the AuthComponent
if (route.component === AuthComponent) {
this.handlers = {};
return false;
}
return !!route.routeConfig && !!this.handlers[url];
}
/**
* Determines which route we want to retrieve if shouldAttach returns true.
* Fired when shouldAttache returns true
* @param route current route
*/
retrieve(route: ActivatedRouteSnapshot): DetachedRouteHandle {
let url: string = this.getRouteIdentifier(route);
if (!route.routeConfig) {
return null;
}
return this.handlers[url];
}
shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean {
let currentUrl: string = this.getRouteIdentifier(curr);
let futureUrl: string = this.getRouteIdentifier(future);
return currentUrl === futureUrl;
}
/**
* Returns the unique identifier for each route
* @param route: route to identify
*/
getRouteIdentifier(route: ActivatedRouteSnapshot): string {
return route.url.join('/');
}
}
我有一些非常特殊的情况需要重复使用路由,所以平均而言,我存储了最多2条路径。
有没有人有想法?