How to use the @antv/g6.registerBehavior function in @antv/g6

register(name: string, behavior: Behavior) {
    const { graphType } = behavior;

    this.behaviors[name] = behavior;

    switch (graphType) {
      case GraphType.Flow:
        G6.registerBehavior(name, this.wrapEventHandler(GraphType.Flow, behavior));
        break;

      case GraphType.Mind:
        G6.registerBehavior(name, this.wrapEventHandler(GraphType.Mind, behavior));
        break;

      default:
        G6.registerBehavior(name, behavior);
        break;
    }
  }
}

const nodeItems = graph.getNodes();
    const height = graph.get('height');
    const width = graph.get('width');
    const padding = 10;
    nodeItems.forEach(item => {
      const model = item.getModel();
      if (model.x > width - padding) model.x = width - padding;
      else if (model.x < padding) model.x = padding;

      if (model.y > height - padding) model.y = height - padding;
      else if (model.y < padding) model.y = padding;
    });
  }
};

G6.registerBehavior('double-finger-drag-canvas', {
  getEvents: function getEvents() {
    return {
      wheel: 'onWheel'
    };
  },

  onWheel: ev => {
    if (ev.ctrlKey) {
      const canvas = graph.get('canvas');
      const pixelRatio = canvas.get('pixelRatio');
      const point = canvas.getPointByClient(ev.clientX, ev.clientY);
      let ratio = graph.getZoom();
      if (ev.wheelDelta > 0) {
        ratio = ratio + ratio * 0.05;
      } else {
        ratio = ratio - ratio * 0.05;

register(name: string, behavior: Behavior) {
    const { graphType } = behavior;

    this.behaviors[name] = behavior;

    switch (graphType) {
      case GraphType.Flow:
        G6.registerBehavior(name, this.wrapEventHandler(GraphType.Flow, behavior));
        break;

      case GraphType.Mind:
        G6.registerBehavior(name, this.wrapEventHandler(GraphType.Mind, behavior));
        break;

      default:
        G6.registerBehavior(name, behavior);
        break;
    }
  }
}

const nodeItems = graph.getNodes();
    const height = graph.get('height');
    const width = graph.get('width');
    const padding = 10;
    nodeItems.forEach(item => {
      const model = item.getModel();
      if (model.x > width - padding) model.x = width - padding;
      else if (model.x < padding) model.x = padding;

      if (model.y > height - padding) model.y = height - padding;
      else if (model.y < padding) model.y = padding;
    });
  }
};

G6.registerBehavior('double-finger-drag-canvas', {
  getEvents: function getEvents() {
    return {
      wheel: 'onWheel'
    };
  },

  onWheel: ev => {
    if (ev.ctrlKey) {
      const canvas = graph.get('canvas');
      const pixelRatio = canvas.get('pixelRatio');
      const point = canvas.getPointByClient(ev.clientX, ev.clientY);
      let ratio = graph.getZoom();
      if (ev.wheelDelta > 0) {
        ratio = ratio + ratio * 0.05;
      } else {
        ratio = ratio - ratio * 0.05;

register: () => {
                    G6.registerBehavior('graphin-highlight', graphinHighlight);
                },
            },