javascript - 如何使用咖啡脚本在 Framer Studio (Framer.js) 中创建和触发自定义事件？

Question

var event = new Event('build');

// Listen for the event.
elem.addEventListener('build', function (e) { ... }, false);

// Dispatch the event.
elem.dispatchEvent(event);

在此处输入链接描述 本文演示了如何创建和调度 DOM 事件。此类事件通常称为合成事件，而不是浏览器本身触发的事件。

Answer 1

我不确定您要做什么，但可能您希望在 FramerLayer对象上自定义事件，对吧？

该Layer对象有一些很好的速记函数：on()和emit(). 你像这样使用它们：

layer = new Layer

customEventName = "something"

layer.on customEventName, (argument, layer) ->
    print "Custom event", argument, layer

layer.emit customEventName, 1

layer.emit customEventName, 2

这将打印出以下内容：

» "Custom event", 1, <Layer layer id:1 (0, 0) 200x200>
» "Custom event", 2, <Layer layer id:1 (0, 0) 200x200>

Answer 2

从 FB 的 Framer 组获得此链接。

这是一个适合我需要的简单cs示例

# npm install events
EventsEmitter = require('events')

class customEvent extends EventsEmitter
    constructor: ->
        @on "startScan", -> startAppsScan()
        @on "cancelScan", -> cancelScan()

startScanButton = new Layer
    x: Align.center
    y: Align.center(-150)
    backgroundColor: "yellow"

cancelScanButton = new Layer
    x: Align.center
    y: Align.center(150)
    backgroundColor: "red"

startScanButton.onClick ->
    evt = new customEvent
    evt.emit "startScan"

cancelScanButton.onClick ->
    evt = new customEvent
    evt.emit "cancelScan"

startAppsScan = ->
    print "starting scan...."

cancelScan = ->
    print "scan is cancelled !"