如何使用coffeescript在Framer Studio（Framer.js）中创建和触发自定义事件？

var event = new Event('build'); 

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

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

enter link description here 本文演示如何创建和分派DOM事件。这类事件通常被称为综合事件，而不是浏览器本身触发的事件。如何使用coffeescript在Framer Studio（Framer.js）中创建和触发自定义事件？

来源

2017-01-19 Amitka

你问如何转换给定的JS来的CoffeeScript？ –

我知道如何将它转换为cs，但如何在framer中使用它？创建自定义事件，从图层元素中触发它，通过包含图层捕获事件？ – Amitka

Got this link from Framer group at FB.

下面是一个简单的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 !"

来源

2017-01-19 11:18:44 Amitka

我不知道你想做什么，但可能你想在成帧器Layer对象的自定义事件，对？

对象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>

来源

2017-01-20 11:00:20 Niels

谢谢尼尔斯。我不知道这是可能的，并尝试了各种解决方法。什么事件冒泡？父层是否可以侦听触发自定义事件的子层？ – Amitka

我不认为我们会自动发布自定义事件。你显然可以自己设置这个，但是这有点多。 – Niels

再次感谢。如果没有太多的麻烦，你可以展示如何设置它？一个代码示例？ – Amitka

如何使用coffeescript在Framer Studio（Framer.js）中创建和触发自定义事件？

回答

相关问题