视图中的原始事件委托 - 什么是Ember方式？

Question

假设我们有以下DOM元素：

<ul>
  <li>foo</li>
  <li>bar</li>
  <li>baz</li>
</ul>

从一开始我们都知道这种方法不是最佳的：

$('li').on('click', function() {…});

相反，我们倾向于这样写：

$('ul').on('click', 'li', function() {…});

但是恩伯呢？在Ember中，视图表示单个 DOM元素。如果我写这个：

<ul>
  {{#each people}}
    {{#view App.PersonEntryView}}{{name}}{{/view}}
  {{/each}}
</ul>

并且PersonEntryView实现了 click 处理程序，我们最终得到了第一个jQuery示例，还是我们做到了？

我倾向于争取最佳解决方案，所以我很好奇所谓的Ember事件授权方式是什么？

我是否应该为了授权而为UL创建一个视图？我可以，但应用程序中的多个列表呢？

那么，你们怎么做呢，伙计们？

Answer 1

  

如果我要编写....并且PersonEntryView实现了单击处理程序，我们最终会得到第一个jQuery示例，或者我们做到了吗？

不完全是。 Ember使用jQuery将所有事件委托给根元素。当事件发生时，它会找到具有处理程序的最近视图。因此，当您在PersonEntryView上定义click（）处理程序时，您将获得第一个示例的易于开发以及第二个示例的性能。

  

我倾向于争取最佳解决方案，所以我很好奇所谓的Ember事件授权方式是什么？

关于这方面的文档非常好，请查看指南 event-delegation和event-bubbling

  

我是否应该为了授权而为UL创建一个视图？我可以，但应用程序中的多个列表呢？

不。只需在列表元素上定义一个单击处理程序，如：

App.PersonEntryView = Ember.View.extend({
  click: function(event) {
    //handle event here
  }
});