Question

我有一些看起来像这样的标记：

<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>

我希望mark-down标签能够看到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的值，但它总是为空。我唯一的成功就是使用setTimeout异步检查值。

Answer 1

textarea特别难以以这种方式使用，因为你无法观察到MutationObservers改变的内容，只有事件。

更糟糕的是，根本没有设置textarea.value的信号（这是你的绑定所做的）。

如果您想像这样使用textarea，建议您在mark-down元素上公开属性以绑定值，并聆听textarea中的事件以监控用户编辑。

<mark-down value="{{post}}">
  <textarea></textarea>
</mark-down>

访问使用数据绑定设置的子项的属性

1 个答案: