I'm learning Incisor and I'm trying to understand how to pass custom data into my callback function when a button is clicked. I have a block of JSON data and a button. I am using a pressCallback and passing my data as a parameter. However, when I log the callback argument, I'm seeing a MouseEvent object instead of the data I passed in.

Here is my sample code:

class ProjectMain {

    init() {
        
        let data = {"id": 0, "email": "[email protected]", "active": true};

        this.button = new Button( nc.graphicAssets.WhiteBox, nc.mainScene, "MyButton" );
        this.button.addPressCallback( this, "myPressCallback", data );

        this.myPressCallback = function( data ) {
            console.log('callback:', data );
        }
    }
}

In this code, when I click the button, the callback function is triggered, but the console logs a MouseEvent object rather than the data object I passed in. How can I properly pass and access the custom data in the callback function?

I'm learning Incisor and I'm trying to understand how to pass custom data into my callback function when a button is clicked. I have a block of JSON data and a button. I am using a pressCallback and passing my data as a parameter. However, when I log the callback argument, I'm seeing a MouseEvent object instead of the data I passed in.

Here is my sample code:

class ProjectMain {

    init() {
        
        let data = {"id": 0, "email": "[email protected]", "active": true};

        this.button = new Button( nc.graphicAssets.WhiteBox, nc.mainScene, "MyButton" );
        this.button.addPressCallback( this, "myPressCallback", data );

        this.myPressCallback = function( data ) {
            console.log('callback:', data );
        }
    }
}

In this code, when I click the button, the callback function is triggered, but the console logs a MouseEvent object rather than the data object I passed in. How can I properly pass and access the custom data in the callback function?

• javascript
• incisor

Share Improve this question Follow asked Nov 19, 2024 at 21:08 JohnJohn 1111 bronze badge 3

• Do you need to pass it? The variable data should be in scope when myPressCallback runs without passing it. – James Commented Nov 19, 2024 at 21:46
• Yes. You're right. In this contrived example, I don't need to actually pass the parameter. But I'm still confused as to why the parameter to the callback is a MouseEvent instead of my data object. – John Commented Nov 19, 2024 at 22:30
• 1 Try this.myPressCallback = function( browserEvent, camera, data ) { - this pattern is covered in the addPressCallback docs for the third parameter. – James Commented Nov 20, 2024 at 3:36

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

To elaborate on this, as @James has mentioned, data is already in scope and accessible, so you wouldn't need to pass it in

so both of these approaches would work

let data = {"id": 0, "email": "[email protected]", "active": true};
this.button.addPressCallback( this, "myPressCallback" );

this.myPressCallback = function() {
  console.log('callback:', data );
}

let data = {"id": 0, "email": "[email protected]", "active": true};
this.button.addPressCallback( this, "myPressCallback", data );

this.myPressCallback = function( browser, camera, data_passed_in ) {
    console.log('callback:', browser, camera, data_passed_in, data );
}

Here is the tutorial on buttons covered by Incisor:

https://www.youtube/watch?v=coR_HjYuchI