如何确定是什么导致了 Polymer JS 中的事件触发？

Question

我目前正在收听我的熨斗选择器上的 iron-select 事件，并根据该事件设置和重置一些值。

我如何在侦听器中确定事件的原因？用户 clicked/tapped 是铁选择器还是以编程方式设置了铁选择器？

  listeners: {
    'myElement.iron-select': '_runMyFunctions',
  },


  _runMyFunctions: function(){

   // if(user clicked a iron selector){
   //      do this stuff
   // }

   // if(an iron selector was set somewhere else in the program){
   //      do this other stuff
   // }
}

Answer 1

这里有一个技巧。您可以使用标志来检查更改是来自函数还是来自 UI

<base href="https://polygit2.appspot.com/components/">
<script src="webcomponentsjs/webcomponents-lite.min.js"></script>
<link rel="import" href="polymer/polymer.html">
<link rel="import" href="iron-selector/iron-selector.html">
<dom-module id="selector-tester">
  <template>
    <style></style>
    <iron-selector id='selector' attr-for-selected="name" selected="foo">
      <div name="foo">Foo</div>
      <div name="bar">Bar</div>
      <div name="zot">Zot</div>
    </iron-selector>
  </template>
</dom-module>
<script>
  Polymer({
    is: 'selector-tester',
    properties: {
      _isFuncSelected: {
        type: Boolean,
        value: false
      }
    },
    listeners: {
      'iron-select': '_selected'
    },
    _selected: function(e) {
      if (this._isFuncSelected)
        console.log('this change is from function');
      else
        console.log('this change is from UI');

      this._isFuncSelected = false;
    },
    attached: function() {
      this._isFuncSelected = true;
      this.$.selector.selected = 'bar';
    }
  })
</script>


<selector-tester></selector-tester>

如何确定是什么导致了 Polymer JS 中的事件触发？

How do determine what caused an event to trigger in Polymer JS?

javascript

events

listener

polymer

polymer-1.0