在Polymer中，观察者和监听器有何区别？

Question

如果我将属性设置为以下内容：

properties: {
    myProp: {
        type: Object,
        notify: true,
        observer: '_onChangedByObserver',
    }
},
listeners: {
    'my-prop-changed': '_onChangedByListener'
}

当我运行代码时，无论是_onChangedByObserver还是_onChangedByListener都会在myProp改变时调用。

那么如何确定该使用哪个？

提示：我想知道更改是来自外部消费者还是内部赋值。我该怎么办？

谢谢！

- garyx

Answer 1

观察者会在属性值改变时被调用。监听器是所有类型事件的事件处理程序，不仅仅是属性更改。对于观察者来说，您不需要设置notify: true，但如果您想要在属性更改时调用监听器，则这是必要的。此外，方法签名也有所不同。观察者传递新值和旧值，而监听器在详细字段中获得带有新值的事件。我认为在这两种情况下都无法确定导致更改的原因。

- Günter Zöchbauer

---

谢谢回复！这真的很有帮助。您能否也看一下这个plunkr http://plnkr.co/edit/ZTONoYhYRIXqEijvfU3v?p=preview，如果使用数据绑定进行更改，则“prop-changed”事件不会被触发吗？否则为什么widget-b无法在侦听器中检测到“value-changed”事件（当从外部代码进行更改时）？ - garyx

抱歉，我无法从您的 Plnkr 上确定出问题所在，能否请您删除所有按预期运行的部分，只保留未正常运行的部分？ - Günter Zöchbauer

看起来你正在设置a上的value并期望通知b上的监听器。如果你实际上想要在b上设置值，你应该考虑到最近与名为value的属性相关的错误，并且你需要使用.set('value', 'a1')而不是.value = 'a1'（我只从Dart中使用Polymer，有一些差异。我不确定在JS中何时需要或不需要.set()）。http://plnkr.co/edit/iMTwLuBIlFdfFoHptyGe?p=preview - Günter Zöchbauer

我测试了一下，在我的Chrome浏览器中，属性'value'可以正常工作。当直接在widget-b上更改值时，事件'value(x)-changed'将被触发，无论是使用.set()还是.value='a1'。如果我在widget-a上进行更改，则该值将正确传递到widget-b，观察者被调用，但是没有触发'value-changed'事件，尽管'value'确实已经'changed'。但是感谢所有的帮助，我现在更清楚了。 - garyx

好的，错过了那个绑定。我想我现在理解问题了。可能是https://github.com/Polymer/polymer/issues/3077。 - Günter Zöchbauer