Wie füge ich vorhandenen HTML-Elementen in TypeScript / JSX Attribute hinzu?
Weiß jemand, wie man alle nativen HTML-Elementattribute mit benutzerdefinierten Attributen richtig hinzufügt / erweitert?
Mitdie TypeScript-Dokumentation zum Zusammenführen von Schnittstellen, Ich dachte, ich könnte das einfach machen:
interface HTMLElement {
block?: BEM.Block;
element?: BEM.Element;
modifiers?: BEM.Modifiers;
}
<div block="foo" />; // error
Aber ich erhalte den folgenden Intellisense-Fehler in vscode 1.6.1 (aktuell):
[ts] Eigenschaft 'block' existiert nicht für den Typ 'HTMLProps'.
DasHTMLProps
, auf das sie sich beziehen, istReact.HTMLProps<T>
und diediv
element wird deklariert, um es wie folgt zu verwenden:
namespace JSX {
interface IntrinsicElements {
div: React.HTMLProps<HTMLDivElement>
}
}
Ich habe versucht, das @ neu zu deklarierediv
, aber ohne Erfolg.
Verbunden:https: //github.com/Microsoft/TypeScript/issues/1168
Bearbeiten Hier ist, was für mich gearbeitet hat:
declare module 'react' {
interface HTMLAttributes<T> extends DOMAttributes<T> {
block?: string
element?: string
modifiers?: Modifiers // <-- custom interface
}
}