以编程方式更改当前位置

Question

如何以编程方式更改当前位置？

app-location 在 parent 元素上，我想从 child 元素更改它。

这里是parent摘录

dom-module(id='test', assetpath='/')
    template
        app-location(route='{{route}}')
        app-route(route='{{route}}', pattern='/:page', data='{{rootData}}', tail='{{rootTail}}')
        ...
        login-page(name='login', route='[[rootTail]]')
        ...
    script.
        Polymer({is: 'test');

和child

dom-module(id='login-page')
    template
        div(class='layout horizontal center-justified mh400')
            div(class='layout vertical center-justified')
                form(is='iron-form', id='login-form', method='post', action='/api/auth/login', on-iron-form-response='onResponse')
                    ...
    script.
        Polymer({
            is: 'login-page',
            onResponse: function (event) {
                var resp = event.detail.response;

                if (resp.success) {
                    // Change here the location
                }
            }
        })

对不起，玉而不是 html，但我想请理解。

Answer 1

app-location 只是与浏览器的地址栏交互。它在内部使用 iron-location。没有什么可以阻止您将它也包含在子元素中。它在这里的作用是更新地址栏（而不是监听变化）。在您的 JavaScript、select 元素中更新其 path.

父元素中的app-location会检测地址栏的变化并更新route

dom-module(id='login-page')
    template
        app-location
        div(class='layout horizontal center-justified mh400')
            div(class='layout vertical center-justified')
                form(is='iron-form', id='login-form', method='post', action='/api/auth/login', on-iron-form-response='onResponse')
                    ...
    script.
        Polymer({
            is: 'login-page',
            onResponse: function (event) {
                var resp = event.detail.response;

                if (resp.success) {
                    // TODO: Update with your new path
                    this.shadowRoot.querySelector('app-location').path = '';
                }
            }
        })

以编程方式更改当前位置

Change current location programmatically

web-component

polymer-1.0