How to use the matter-js.Events.on function in matter-js

for (let i = 0; i < pairs.length; i++) {
        const pair = pairs[i];

        if (pair.bodyA.label === 'avatar' || pair.bodyB.label === 'avatar') {
          // console.log('avatar collision start');
          this.onBlock = (pair.bodyA.label === 'avatar') ? pair.bodyB : pair.bodyA;
        }

        if (pair.bodyA.label === 'avatarChord' || pair.bodyB.label === 'avatarChord') {
          // console.log('avatar collision start');
          this.onBlockChord = (pair.bodyA.label === 'avatarChord') ? pair.bodyB : pair.bodyA;
        }
      }
    });

    Events.on(this.engine, 'collisionEnd', e => {
      const pairs = e.pairs;
      for (let i = 0; i < pairs.length; i++) {
        const pair = pairs[i];
        if (pair.bodyA.label === 'avatar' || pair.bodyB.label === 'avatar') {
          // console.log('avatar collision start');
          this.onBlock = null;
        }

        if (pair.bodyA.label === 'avatarChord' || pair.bodyB.label === 'avatarChord') {
          // console.log('avatar collision start');
          this.onBlockChord = null;
        }
      }
    });

  }

initCollisionEvents() {
    Events.on(this.engine, 'collisionStart', e => {
      const pairs = e.pairs;
      for (let i = 0; i < pairs.length; i++) {
        const pair = pairs[i];

        if (pair.bodyA.label === 'avatar' || pair.bodyB.label === 'avatar') {
          // console.log('avatar collision start');
          this.onBlock = (pair.bodyA.label === 'avatar') ? pair.bodyB : pair.bodyA;
        }

        if (pair.bodyA.label === 'avatarChord' || pair.bodyB.label === 'avatarChord') {
          // console.log('avatar collision start');
          this.onBlockChord = (pair.bodyA.label === 'avatarChord') ? pair.bodyB : pair.bodyA;
        }
      }
    });

registerPhysicsEvents() {
    // Collision Events
    Events.on(this.engine, 'collisionStart', this.onCollisionStart);
  }

registerPhysicsEvents() {
    // Collision Events
    Events.on(this.engine, 'collisionStart', this.onCollisionStart);
  }

componentDidMount() {
    this.loopID = this.context.loop.subscribe(this.loop);
    this.props.onInit(this.engine);
    Events.on(this.engine, 'afterUpdate', this.props.onUpdate);
    Events.on(this.engine, 'collisionStart', this.props.onCollision);
  }

componentDidMount() {
    this.loopID = this.context.loop.subscribe(this.loop);
    this.props.onInit(this.engine);
    Events.on(this.engine, 'afterUpdate', this.props.onUpdate);
    Events.on(this.engine, 'collisionStart', this.props.onCollision);
  }

onInit (options: any) { 
        this.state = new GameState();
        this.setState(this.state);
        this.engine = Engine.create();
        this.engine.world.gravity.scale = 0;
        this.createWalls();
        
        Events.on(this.engine, "collisionStart", this.onCollisionStart.bind(this));
        Events.on(this.engine, "collisionEnd", this.onCollisionStart.bind(this));

        this.setSimulationInterval(this.update.bind(this));
        this.clock.setInterval(this.broadcastAllEntityIds.bind(this), 3000);
    }