Question

我正在尝试使用Polymer Shop App框架将paper-button值传递给默认路由器。应用程序外壳和主页中都包含app-location和app-route组件。我不知道如何将数据传递到route对象并刷新视图。

App Shell

<app-location route="{{route}}"></app-location>
<app-route
  route="{{route}}"
  pattern="/:page"
  data="{{routeData}}"
  tail="{{subroute}}"></app-route>

<iron-pages role="main" selected="[[page]]" attr-for-selected="name" selected-attribute="visible">
  <shop-home name="home"></shop-home>
  <shop-detail name="detail"></shop-detail>
</iron-pages>

首页

<paper-button id="item" value="[[item.name]]" on-tap="viewItem">[[item.name]]</paper-button>

...

viewItem() {
  this.route.path = '/detail';
  this.routeData = '/inventory/' + this.$.item.value;
}

P.S。

<a href$="/detail/inventory/[[item.name]]"> successfully redirects to the `detail` page and loads the data.

Answer 1

为了将数据传递给路由对象，请将a tag项包裹而不是按钮元素。在下面的示例中，我没有尝试将您的所有代码转换为此。只是我试图解释我的意思:(注意：我正在为这个主题工作2-3周的应用程序，它现在很好用。）我会尝试添加一个演示。

<a href="/detail/inventory/[[item.name]]"><div>[[item.name]]</div></a>

而不是：

 <paper-button id="item" value="[[item.name]]" on-tap="viewItem">[[item.name]]</paper-button>

如何设置`route`参数和加载新页面

1 个答案: