Кнопка обратной связи полимера не работает с хэш-маршрутизацией
Sup! Кнопка "Назад" иногда не работает с моим проектом. Когда я нажимаю кнопку, переменная page
статирует текущую страницу, и мне нужно нажать кнопку два или три раза, чтобы заставить ее работать, например, я перехожу на страницу /#/rules
из /#/home
, но она не идет вернитесь к /#/home
, как только я нажмем кнопку "Назад" второй или третий раз, когда он вернется на главную страницу. Вот мой наблюдатель и маршрутизатор:
properties: {
page: {
type: String,
reflectToAttribute: true,
observer: '_pageChanged',
},
},
observers: [
'_routePageChanged(routeData.page)',
],
_routePageChanged: function (page) {
this.page = page || 'home';
this.set('route.path', `/${this.page}`);
},
_pageChanged: function (page) {
// Load page import on demand. Show 404 page if fails
var resolvedPageUrl = this.resolveUrl(page + '.html');
this.importHref(resolvedPageUrl, null, this._showPage404, true);
window.history.pushState({}, null, `#/${this.page}`);
},
И это мой элемент app-route
:
<app-route route="{{route}}" pattern="/:page" data="{{routeData}}" tail="{{subroute}}"></app-route>
Просто не могу понять, почему он не работает в первый раз. Любая помощь приветствуется, и я уже много искал без каких-либо результатов.
Ответы
Ответ 1
Можете ли вы попробовать это, если у вас есть <app-route route="{{route}}"></app-route>
?
observers: [
'_routePageChanged(route.path)',
],
_routePageChanged: function(path) {
if (path) {
this.page = this.routeData.page;
} else {
/*
* It unnecessary to have the following line.
*/
// this.page = 'home';
this.set('route.path', '/home');
}
},
Почему это работает в конце концов?
Я выучил свой урок, отлаживая исходный код <app-route>
. Если путь пуст, код для обновления data
будет пропущен - и ваш наблюдатель _routePageChanged(routeData.page)
не будет запущен. См
Вы можете считать это недостатком в <app-route>
. Что бы это ни было, это с открытым исходным кодом, и вы всегда можете найти свой путь.