1

I am using draw2d-js, wherein I need the onMouseEnter() functionality. The docs suggest that I override the onMouseEnter:

  /**
     * @method
     * Callback method for the mouse enter event. Usefull for mouse hover-effects.
     * Override this method for your own effects. Don't call them manually.
     *
     * @template
     **/
    onMouseEnter: function()
    {
    },

I have tried: (file: on_mouse_enter.ts):

const draw2d = require('draw2d');

export class CustomEdge extends draw2d.Figure {
  override onMouseEnter(): void {
    console.log('Mouse Entered');
  }
}

However, I get the error:

Error: src/library/onMouseEnter.ts:7:12 - error TS4113: This member cannot have an 'override' modifier because it is not declared in the base class 'any'.

7   override onMouseEnter(): void {
             ~~~~~~~~~~~~

I want to override only one method from the draw2s.Figure class: the onMouseEnter() method.

jonrsharpe
  • 115,751
  • 26
  • 228
  • 437
O oLo O
  • 23
  • 5
  • Drop the `override` keyword in this case. `override` is for functions for which the override signature can be statically verified, and your parent function doesn't have a declared type. If you're feeling ambitious, you can write a `.d.ts` file to well-type `draw2d`, but that's probably overkill. – Silvio Mayolo Aug 05 '22 at 22:41

1 Answers1

1

Thanks for the help, @Silvio Mayolo.

The final solution looks like this:

// client, the caller
  let _customEdge = new CustomEdge();
  _customEdge.onMouseEnter(_con);

The implementation of onMouseEnter looks like so:

const draw2d = require('draw2d');

export class CustomEdge extends draw2d.Figure {
  onMouseEnter(_con: any): void {
    console.log('Mouse Entered');
    //_con.set
  }

The function works correctly when mouse enters the designated area on the screen.

O oLo O
  • 23
  • 5
  • Hi, @O hoo O, Welcome! Thanks to share your solution with the community. Please, could you check your question as resolved? Congrats! – Luciana Oliveira Aug 15 '22 at 12:45