polymer - 如何通过 app-route 元素的数据更改 URL

标签 polymer polymer-1.0

是否可以通过更改 polymer 中的应用程序路由数据对象来更改 URL?就像这里描述的:https://www.polymer-project.org/1.0/toolbox/routing#change-routes

在此示例中,他们使用 this.set('routeData.user', 'mary');更改 URL。

在我们的例子中它不起作用,我们无法在代码中找到问题。 我们几乎删除了所有代码并仅使用此应用程序路由器配置:

<app-route route="{{route}}"
           pattern="/:view"
           data="{{routeData}}">
</app-route>

在我们附加的生命周期事件中,我们使用这个:

attached: function(){
    var self = this;

    setTimeout(function(){
      self.set('routeData.view', 'GNAAA');
    });
  }

地址栏中预期的 URL 是 http://localhost:8888/polymer/index.html#/GNAAA

但是我们只得到了 http://localhost:8888/polymer/index.html#/

我们在这里缺少什么。为什么我们不能像文档中提到的那样通过数据对象设置 URL?也许它是一个错误?但我们在 app-route 的 GutHub Buglist 上找不到任何东西。

更新:我们还使用 iron-location 从 URL 获取查询参数。如果我们删除铁位置,一切都会按预期进行。因此,我们目前在 github 上创建了一个问题。

最佳答案

尝试添加<app-location route="{{route}}"></app-location>在您的<app-route>之前声明。

或者,如果您更喜欢使用 iron-location ,使用iron-route-converter :

<iron-location path="{{path}}" query="{{query}}"></iron-location>
<iron-query-params
    params-string="{{query}}"
    params-object="{{queryParams}}">
</iron-query-params>
<app-route-converter
    path="{{path}}"
    query-params="{{queryParams}}"
    route="{{route}}">
</app-route-converter>

另外,不要忘记使用<link rel="import">导入所有使用过的组件。如果不告诉您,标签或您的组件将无法工作。

关于polymer - 如何通过 app-route 元素的数据更改 URL,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40765216/

相关文章:

javascript - polymer 如何重新渲染元素/模板

javascript - Polymer - 通过纸张复选框显示/隐藏 div

javascript - 在轻量 DOM 树上运行选择器并访问它

css - 如何在 CSS 变量回退中使用逗号?

javascript - 如何在Polymer 1.0中自动对焦/自动点击纸张输入?

javascript - 回调实例冲突?

javascript - Polymer - 如何将观察者附加到阵列?

polymer-1.0 - Polymer JS 中有哪些行为?

javascript - 当表单无效时如何禁用按钮?

html - 去除 polymer 核心支架中的褪色