让 link 仅在点击时触发一个动作，但在新标签点击时打开不同的路线

Question

我想执行以下操作：

• 首先，放一个link.
• 单击时，此 link 应该会在我当前的路线中触发一个动作（即折叠面板或类似的东西）

但是

• 当用户右键单击并选择 "new tab" 时，同样的 link 应该打开一个单独的路径（并且也不会触发当前路径中的任何操作，因为它无论如何都没有意义）

到目前为止，我已经尝试了以下方法：

<span {{action 'collapsePanel'}}>
  {{#link-to 'otherRoute'}}
    Some text
  {{/link-to}}
</span>

我希望通过将其包含在可点击范围内来覆盖默认的 link-to 行为，但无济于事：现在当我点击 link 文本时，我被重定向到新路线和点击操作本身永远不会发生。

是否有可能实现类似使用 EmberJS 或什至简单的 JS 调整的东西？

谢谢！

Answer 1

将span放入其中并使用闭包动作：

{{#link-to 'otherRoute'}}
  <span onclick={{action 'collapsePanel'}}>
    Some text
  </span>
{{/link-to}}

然后你可以调用 preventDefault 和 return false:

collapsePanel(event) {
  event.preventDefault();
  return false;
}

这应该可以防止事件冒泡到 link-to。

Answer 2

好的伙计们，多亏了一位同事，我解决了这个问题。这段代码完全符合我的预期：

{{#link-to "otherRoute"}}
    <span {{action "collapsePanel" bubbles=false}}>
        Some text
    </span>
{{/link-to}}

关键是设置 "bubbles=false"，这可以防止操作接管 link 行为，但仍然允许点击触发它。