I have a lightning component called modal which is used in another component called Split, the modal takes an array of buttons to render them (and does some more)
I have a working version of it in another component and wanted to use it again. But for some reason I receive the
Action failed: lightning:button$controller$handleClick [d.run is not a function]
Everytime I click the button.
The modal component takes the array of buttons like this:
let btns = [];
btns.push(['lightning:button', {
'label': 'Cancel',
'onclick': cmp.getReference('c.onCancelClick'),
'class': 'slds-button '
}]);
btns.push(['lightning:button', {
'label': 'Confirm',
'onclick': cmp.getReference('c.onConfirmClick'),
'class': 'slds-button slds-button_brand'
}]);
let modal = cmp.find('confirmationDialog');
modal.set('v.Buttons', btns);
The functions referenced in the onclick events are in the Split component.
Once the buttons are passed, they get created by
$A.createComponents
which works as expected. But clicking them gives the error.
For some reason it crashes in Google Chrome
(Version 64.0.3282.167 (64-Bit))
works fine in Firefox (52.5.2 (32-bit))
And Edge says
Action failed: lightning:button$controller$handleClick [Object doesn't support property or method 'run']
And as mentioned before, it works in the other component (in all three browsers)
Can someone help me, fix this
PS.: All my components are API Version 42.0
Best Answer
In my case I was missing the exclamation point in action in the component definition:
incorrect: onclick = "{ c.someEvent }"
correct: onclick = "{! c.someEvent}"