0

私は、yeoman ジェネレーターを介して Polymer を使用しようとし始めました。ポリマー スターター キットと同じコードと思われるものを足場にしました。

app/index.html を微調整して、必要なものを追加し、不要なものを削除してから、使用するルートを設定しようとしました。さまざまなルートへのアンカーがたくさんある紙のメニューが既にあったので、そのうちの 1 つをコピーし、ルートの名前を「about」に変更しただけです。

<a data-route="users" href="/users" on-click="onDataRouteClick">
  <iron-icon icon="info"></iron-icon>
  <span>Users</span>
</a>

<a data-route="about" href="/about" on-click="onDataRouteClick">
  <iron-icon icon="info"></iron-icon>
  <span>About</span>
</a>

(1 つ目は既に存在し動作しているバージョン、2 つ目はコピーされたバージョン)

iron-pages次に、メイン コンテンツ エリアで、タグ内のセクションで同じことを行いました。

<section data-route="users">
  <paper-material elevation="1">
    <h2 class="page-title">Users</h2>
    <p>This is the users section</p>
    <a href="/users/Rob">Rob</a>
  </paper-material>
</section>

<section data-route="about">
  <paper-material elevation="1">
    <h2 class="page-title">About</h2>
    <p>About Section</p>
  </paper-material>
</section>

前と同じように、既存のセクションをコピーし、data-route値を上のアンカーの同じ値「about」に置き換えました。しかし、左側のパネルにある [バージョン情報] リンクをクリックすると、2 つの顕著な異なる動作が見られます。

  • ページが完全に読み込まれているように見える: About リンクをクリックすると、ブラウザーの URL は localhost:5000/about になり、ユーザーをクリックすると localhost:5000/#!/users になります。
  • メイン コンテンツ セクションに何もレンダリングされません: 前のエラーに関連していると思いますが、localhost:5000/#!/about をヒットしようとしても、まだ何も表示されません。

それ以外は何も触れていません。何かを設定する必要がある他の場所はありますか？と思われたポリマー動画について。

4

1 に答える 1

1

page.js ルートを更新します (おそらく にあります/elements/routing.html)。ポリマー スターター キットを参照してください。

page('/about', scrollToTop, function() {
  app.route = 'about';
});
于 2015-10-12T06:06:54.277 に答える