单个 event.trigger 或 event.delegate 上的多个事件处理程序？答案

【问题标题】：Multiple event handlers on a single event.trigger or event.delegate?单个 event.trigger 或 event.delegate 上的多个事件处理程序？
【发布时间】：2016-08-25 18:18:40
【问题描述】：

我正在努力将 PDF.JS 与 Aurelia 集成，并且我想运行两种方法来响应 scroll 事件。通常，我会将这两个功能合并为一种方法。但是，对于我的用例，我需要为每种方法使用不同的绑定行为。

我有一个renderHandler，我想像这样与scroll.trigger 一起使用：

<div ref="container" class="pdf-container" scroll.trigger="renderHandler() & debounce:250">

但是，我还有另一个 scrollHandler（它不再处理渲染事件，现在只处理值绑定更新，例如滚动时的页码），我想与这样的油门行为一起使用：

<div ref="container" class="pdf-container" scroll.trigger="scrollHandler & throttle">

另外，这些工作。我不知道如何把它们放在一起。 Aurelia 目前不允许在 trigger 或 delegate 表达式中使用多个表达式，并且在元素中复制属性没有任何效果（因为在 Aurelia 的解析过程中复制可能会被破坏）。

有没有办法为同一个事件声明性地使用具有不同绑定行为的两个处理程序？

【问题讨论】：

标签： javascript aurelia

【解决方案1】：

框架目前不支持同一事件、元素和绑定命令组合的多个事件绑定。

作为一种解决方法，您可以添加 trigger2 绑定命令：

import {SyntaxInterpreter} from 'aurelia-templating-binding';
SyntaxInterpreter.prototype.trigger2 = SyntaxInterpreter.prototype.trigger;

那么您就可以在同一个元素上使用scroll.trigger 和scroll.trigger2。

例子：

https://gist.run/?id=b51e1c0ff28de5d19d1018881399c4e4

【讨论】：

我今天想到了别的东西——我也许可以使用scroll.bind 来调用其中一个函数，只要它不需要绑定行为或参数。

【解决方案2】：

我不知道它在哪个版本中可用。但这种语法有效。

<button click.delegate="[click1(), click2()]">multiple click handlers</button>

【讨论】：