Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/typescript/9.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/8/svg/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Typescript无重载与此调用onmouseover事件匹配_Typescript_Svg_Overloading_Mouseevent - Fatal编程技术网

Typescript无重载与此调用onmouseover事件匹配

Typescript无重载与此调用onmouseover事件匹配,typescript,svg,overloading,mouseevent,Typescript,Svg,Overloading,Mouseevent,我是个打字新手。当我试图将事件侦听器分配给typescript中的onmouseover事件时,我遇到了一个重载错误。我几乎可以肯定这是一个新手的错误。我将感谢任何人的帮助 这是我的密码: 自定义SVG类: class CustomSVGElement { type: string; namespace: string; node: Element; constructor(type: string) { this.type = type;

我是个打字新手。当我试图将事件侦听器分配给typescript中的onmouseover事件时,我遇到了一个重载错误。我几乎可以肯定这是一个新手的错误。我将感谢任何人的帮助

这是我的密码:

自定义SVG类:

class CustomSVGElement {
    type: string;
    namespace: string;
    node: Element;
    constructor(type: string) {
        this.type = type;
        this.namespace = 'http://www.w3.org/2000/svg';
        this.node = document.createElementNS(this.namespace, this.type);
        return this;
    }


    attr(attrs: object) {
        for (const [key, value] of Object.entries(attrs)) {
            this.node.setAttributeNS(null, key, value);
        }
        return this;
    }

    append(element: any) {
        const parent = (typeof element === 'string') ? document.querySelector(element) : element.node;
        parent.appendChild(this.node);
        return this;
    }

    addInnerHTML(innerHTML: string) {
        if (innerHTML != undefined) {
            this.node.innerHTML = innerHTML;
        }
        return this;
    }
}

class Sight {
  svg: any;
  constructor(selector: string, width: number, height: number) {
    this.svg = new CustomSVGElement(selector).attr({ width: `${width}`, height: `${height}`}).append(selector);
  }

  draw(type: string, attrs: object, innerHTML: string) {
    return new CustomSVGElement(type).attr(attrs).addInnerHTML(innerHTML).append(this.svg);
  }
}

主类方法:

const svg: Sight = new Sight('.svg', 1500, 600);
const svgPath = svg.draw('path', {class: "baseCategory", d: <some svg path value>}, undefined);
const onMouseOver = (e: MouseEvent) => console.log(`(${e.x}, ${e.y})`);
svgPath.node.addEventListener("mouseover", onMouseOver);

错误消息有点迟钝,但基本上元素类型太一般,无法将MouseeEvent侦听器附加到属性节点。您需要将节点设置或强制转换为更特定的类型,如HtmleElement

No overload matches this call.
  Overload 1 of 2, '(type: "fullscreenchange" | "fullscreenerror", listener: (this: Element, ev: Event) => any, options?: boolean | AddEventListenerOptions): void', gave the following error.
    Argument of type '"mouseover"' is not assignable to parameter of type '"fullscreenchange" | "fullscreenerror"'.
  Overload 2 of 2, '(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void', gave the following error.
    Argument of type '(e: MouseEvent) => void' is not assignable to parameter of type 'EventListenerOrEventListenerObject'.
      Type '(e: MouseEvent) => void' is not assignable to type 'EventListener'.
        Types of parameters 'e' and 'evt' are incompatible.
          Type 'Event' is missing the following properties from type 'MouseEvent': altKey, button, buttons, clientX, and 20 more.ts(2769)