Question

燮！后退按钮有时不适用于我的聚合物项目。当我点击后退按钮时，endIndex变量是当前页面的钢材，我需要按两次或三次按钮以使其工作，例如我从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

无法弄清楚为什么它第一次不起作用。感谢任何帮助，我已经搜索了很多没有结果。

Answer 1

假设你有<app-route route="{{route}}"></app-route>吗？

，你能试试吗？

observers: [
    '_routePageChanged(route.path)',
],

_routePageChanged: function(path) {
    if (path) {
        this.page = this.routeData.page;
    } else {
        /*
         * It's unnecessary to have the following line.
         */
        // this.page = 'home';
        this.set('route.path', '/home');
    }
},

为什么它会起作用？

我通过调试<app-route>的源代码来吸取教训。如果路径为空，则会跳过更新data的代码 - 您的观察者_routePageChanged(routeData.page)将无法触发。参见

您可能会认为它是<app-route>中的缺陷。无论如何，它是开源的，你总能找到自己的方式。

聚合物后退按钮不适用于散列路由

1 个答案: