次のようなマークアップが少しあります。
<polymer-element name="blog-post" noscript>
<template>
<mark-down>
<textarea value="{{post}}"></textarea>
</mark-down>
<polymer-localstorage name="my-blog-editor" value="{{post}}">
</polymer-localstorage>
</template>
</polymer-element>
マークダウンタグでtextareaの値を確認できるようにしたいのですが、いつクエリを実行するかがわかりません。
マークダウンの内部では、私のコードは次のようになります。
attached: function() {
this.textarea = this.$.textareaContent.getDistributedNodes()[0]; // this grabs the textarea element
// create an observer instance
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
console.log(mutation);
});
});
// pass in the target node, as well as the observer options
observer.observe(this.textarea, { attributes: true });
}
残念ながら、ミューテーションオブザーバーは起動しません。attachとdomReadyでtextareaの値を直接チェックしようとしましたが、常にnullです。私が得た唯一の成功は、setTimeoutを使用して値を非同期的にチェックすることです。
textarea
この方法で使用することは特に困難です。これは、MutationObserversでコンテンツが変化するのを観察できず、イベントでのみ観察できるためです。
さらに悪いことに、設定のシグナルはまったくありませんtextarea.value
(これはバインディングが行うことです)。
textarea
このように使用する場合はmark-down
、値をバインドするために要素のプロパティを公開し、からのイベントをリッスンしてtextarea
ユーザーの編集を監視することをお勧めします。
<mark-down value="{{post}}">
<textarea></textarea>
</mark-down>
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加