Ember：带有刷新按钮的选项卡组件

Question

我在 Ember 中有一个选项卡组件（类似于 Bootstrap 的选项卡），其中每个选项卡都可以点击，但标签旁边还有一个刷新按钮。我遇到的问题是，每当我单击刷新按钮触发refresh 操作时，也会触发switchTab 打开选项卡的操作，因为它们是嵌套的。由于actions之间不知道任何关于对方的事情，你如何触发正确的action（或者取消不正确的action？）

<li class="tab" {{action 'switchTab' tab}}>
    <span {{action 'refresh' tab}}>Refresh&nbsp;</span>
    Bubble Bobble Tab
</li>

一种选择是将标签分成自己的跨度并将switchTab放在该元素上，但这意味着只有标签是可点击的（没有更多的css），这是一种糟糕的用户体验。

Answer 1

@Samuel，如果您不希望动作向上冒泡，可以在动作助手中使用bubbles=false。例如，

<li class="tab" {{action 'switchTab'}}>
<span {{action 'refresh' bubbles=false}}>Refresh&nbsp;</span>
Bubble Bobble Tab </li>

http://ember-twiddle.com/b8d2b88cf5b18b613fd2