You can register event listeners on a component by defining variables.listeners.
1
component extends="cbwire.models.Component"{
2
3
variables.listeners ={
4
"counterIncremented":"tweetAboutIt"
5
};
6
7
functiontweetAboutIt(){
8
// Blow up Twitter
9
}
10
11
...
12
}
Copied!
cbwire will invoke the tweetAboutIt method on the component if any other component on the same page emits a counterIncremented event.
When defining your listeners, it is good to put your listener's names in quotation marks, as we have in our component above.
"counterIncremented": "tweetAboutIt"
JavaScript keys are case-sensitive. You can preserve the key casing in CFML by surrounding your listener names in quotations. Without the quotations, CFML will convert the key to all uppercase, such as TWEETABOUTIT.
🙃
Event Listeners In JavaScript
1
// File: ./views/wires/myView.cfm
2
<script>
3
cbwire.on('counterIncremented',counter=>{
4
alert('The counter was incremented with a value of: '+ counter );