Reputation: 23
I'm trying to pass a variable into a callback function that's apart of an event listener for Azure Maps but that variable comes up as 'undefined' once I console.log the variable in the other function. Not sure what I'm doing wrong. Am I passing the variable to the callback function the wrong way?
loadData = () => {
let dataSource = new window.atlas.source.DataSource('map', {
cluster: true,
clusterRadius: clusterRadiusLevel,
clusterMaxZoom: maxClusterZoomLevel
});
maps.event.add('click', layer, (e,dataSource) => this.clickedCluster(e,dataSource)
}
clickedCluster = (e,dataSource) => {
console.log(dataSource)
}
there's definitely more to the loadData function but gave enough information of what I'm trying to do. The console.log in clickedCluster keeps coming back undefined. I know it's not undefined because I console logged the variable inside the loadData function and I'm getting an object back containing all the data.
Upvotes: 1
Views: 953
Reputation: 11574
Firstly, you're missing a closing paren on the maps.event...
line.
Secondly, don't include dataSource
as the 2nd param to your anonymous arrow function on the same line:
let loadData = () => {
let dataSource = new window.atlas.source.DataSource('map', {
cluster: true,
clusterRadius: clusterRadiusLevel,
clusterMaxZoom: maxClusterZoomLevel
});
maps.event.add('click', layer, e => this.clickedCluster(e, dataSource));
};
let clickedCluster = (e, dataSource) => {
console.log(dataSource)
};
The highlight why this is correct, take a look at this simpler example
let callback = a => console.log('callback', a);
let x = 'hello';
let caller1 = x => callback(x);
let caller2 = () => callback(x);
caller1(); // undefined
caller2(); // 'hello'
This is called "shadowing" btw (wiki).
Upvotes: 1