Question

我有一个 v-fire 聚合物：

<script>
    Polymer({
        is: 'v-fire',

        properties : {
            onFire: {
                type : String,
                reflectToAttribute: true
            }
        },

        firing: function () {
            this.fire('fire');
        }
    })
</script>

我希望能够在我的Polymer元素中的任何位置使用它，使它们触发内部函数，使它们执行特定任务，如更新，以便在v-fire调用时{{1}更新所有内容}}

例如，我创建了一个要测试的新对象：

firing

index.html

中的

<script>
    Polymer({
        is: 'fire-tester',

        _updateContent: function () {
            alert('I get updated');
        }
    });
</script>

它不起作用，因为我认为当插入 fire-tester 时， v-fire 不会被处理。有没有办法告诉Polymer处理dom块，好像它是在本地DOM中声明的那样？

Answer 1

看起来你正在接近事件系统。你想要的是在fire-tester上检测到fire元素上的v-fire事件时运行方法，对吗？这就是我将它们放在一起的方式：

<强> V-fire.html

<script>
  Polymer({
    is: 'v-fire',

    firing: function() {
      this.fire('fire');
    }
  });
</script>

<强>火tester.html

<script>
    Polymer({
      is: 'fire-tester',

      listeners: {
        'fire': '_updateContent'
      },

      _updateContent: function () {
        alert('I get updated');
      }
    });
</script>

<强>的index.html

<fire-tester id="fire-tester"></fire-tester>
<script>
  (function(){
    var ft = document.getElementById('fire-tester');

    var vfire = document.createElement('v-fire');

    Polymer.dom(ft.root).insertBefore(
        vfire,
        Polymer.dom(ft.root).childNodes[0]
    );

    vfire.firing();
  })();
</script>

尝试将Polymer元素附加到另一个Polymer元素中

1 个答案: