問題タブ [custom-element]

Polymer 1.0 要素の適切な使用法<iron-meta>は混乱を招きます。ここに Github のリンクがあります。そして、ここにPolymer デモ サイトへのリンクがあります。

誰かがそれを機能させる方法の適切なコード例を提供できますか?

これは私がこれまでに持っているコードです。

問題へのGithubリンクは次のとおりです。そして、完全な Web アプリのコンテキストで完全な問題コードを含むGithub リポジトリを次に示します。

paper-shadowツイートを表示するために拡張するカスタム Polymer 要素を作成しようとしています。

これが私の実装です：

tweet_element.html

ツイッターダーツ

最後に、TweetElement を作成して DOM に追加しようとするコード:

そして、これを実行すると、次のようになります。

それで、twitter.dartを次のように変更しようとしました：

そして、この要素を次のように DOM に追加します。

そして今、私はこのエラーを受け取りました:

CSS ですべてのカスタム要素を選択する方法はありますか? デフォルトですべてのカスタム要素ブロック要素を作成し (ほとんどのブラウザはデフォルトでインライン化します)、必要に応じてこれをオーバーライドします。

私のルールは次のようになります。

標準ではすべてのカスタム要素にダッシュが含まれているため、それを利用してルールを作成できますが、正規表現を使用する必要があるため、多くの/ほとんどの最新のブラウザーでは遅くなります。組み込みのセレクターがあれば、これはおそらくより高速です。

データ バインディングを使用してカスタム要素を作成しようとしています。

これが私のカスタム要素テンプレートです:

ツイッターダーツ

これは、要素を作成して追加する方法です。

main.dart

tweet-element要素と DOM に追加されていますが、データ バインディングのあるフィールドは空白です。

tweet要素フィールドを他の文字列で設定しようとしましたが、それも機能しなかったため、オブジェクトに問題はありません。

些細な質問で申し訳ありませんが、「iron-input」を含む「my-login-form」などのカスタム要素が必要だとします。私のフォームが 'iron-input' に依存していることをどのように示すのですか? 次のようなものを使用する必要がありますか

「my-login-form.html」ファイルの先頭に?

Polymer のドキュメントでは、構成などの静的データを共有するためにカスタム要素を使用することを提案しています。のようなもの<app-settings>。

パフォーマンスの観点から最適かどうか疑問に思っています。そのような非視覚的要素が使用されるときはいつでも、作成する必要があります。グローバル変数または (AMD/requirejs) モジュールの形式で設定を共有するほうがよいのではないでしょうか?

のような純粋に機能的なタグについても同じことが言えます<iron-ajax>。カスタム要素の多くを配置すると、単に既存の XHR ライブラリを使用するのとは対照的に、パフォーマンスに影響しませんか?

私が作成しているアプリをreset.cssグローバル レベルで使用したいと考えています。また、すべてのシャドウ ルートに浸透するが、特異性が低いことも望んでいます。どうすればこれを達成できますか?

my に次のようなものが含まれているとしましょうreset.css:

次に、カスタム要素には次のようなテンプレートがあります。

私の問題は、テンプレートのliセレクターに打ち負かすのに十分な特異性がないこと::shadow liです。すべてのカスタム要素で自分自身を繰り返す必要はありません。<link>それぞれに a を追加できると思います<template>が、もう一度繰り返します。JavaScript を挿入することもできますが、<link>それが最善の方法かどうかはわかりません。

reset.cssシャドウ ルートを貫通するが、特異性がほとんどないa を使用できる他の方法は何ですか?