2

ポリマー要素のライフサイクルを理解するのに本当に苦労しています。

単一のプロパティを持つカスタム要素があるとしますfooBar。そして、fooBarそのように属性の属性として設定したとします。

<custom-element foo-bar="text"></custom-element>

fooBarここで、要素のライフサイクルの作成中にプロパティとしてプログラムで使用したいとしましょう。みたいな。

Polymer({
    is: "custom-element",
    properties: {
        fooBar: {type: String}
    },
    ready: function(){
        console.log(this.fooBar)
    }, 
    attached: function(){
        console.log(this.fooBar)
    }
})

私が知る限り、エレメント プロパティ fooBar は、DOM 属性 fooBar から読み込まれ、両方が呼び出されるまでロードされませreadyんattached。これは、ready およびアタッチされた callbacks 内から async を呼び出した場合でも当てはまります。

誰でも (1) 要素のプロパティが DOM 属性からインポートされるライフサイクルの場所と、(2) これらの属性にプログラムでアクセスして要素のセットアップ作業を行う方法を説明できますか?

4

1 に答える 1

1

カスタム要素の仕様について読んだことがある場合は、要素のライフサイクルにこのコールバックがありattributeChangedCallback(name, oldVal, newVal)、Polymer ではattributeChanged(type, name). ただし、これは属性をリッスンするための推奨される方法ではありません。代わりに、オブザーバーをそのプロパティ (この場合は on ) にアタッチしますfooBar。

jsbin のサンプルを次に示します。が と の前にfooBarChanged最初に呼び出されていることがわかります。attachedready

http://jsbin.com/gibopu/edit?html,コンソール,出力

于 2015-11-15T07:40:27.550 に答える