React Canvas webglcontextlost

Question

Wie können wir einen webglcontextlost Event-Handler für React Canvas-Komponenten definieren?

class CanvasComponent extends React.Component { 
    componentDidMount() { 
     const canvasDOMNode = this.refs.canvas.getDOMNode(); 
     DrawModule.draw(this.props.drawData, canvasDOMNode); 
    } 

    render() { 
     return (
      <canvas id="canvas" ref="canvas" /> 
     ); 
    } 
} 

Ich versuchte <canvas webglcontextlost={ function() { doSomething(); }} />, auch onWebglcontextlost und andere Kombinationen camelcase, aber ich bekomme Unknown prop Fehler für alle von ihnen.

Die einzige Möglichkeit, die ich gefunden habe, ist canvasDOMNode.addEventListener("webglcontextlost"), aber ich würde einen React Weg bevorzugen.

Hinweis: Ich verwende TypeScript und bemerkte auch, dass diese Eigenschaft in der React.d.ts auf DefinitelyTyped fehlt.

Answer 1

Grundsätzlich gilt:

Reagieren noch nicht das Attribut erkennen Sie angegeben haben. Dies wird wahrscheinlich in einer zukünftigen Version von React behoben werden. React entfernt derzeit jedoch alle unbekannten Attribute. Wenn Sie sie in Ihrer React-App angeben, werden sie daher nicht gerendert.

Von: https://facebook.github.io/react/warnings/unknown-prop.html. Es ist nicht etwas, das an diesem Punkt reagieren kann. Sie sind besser dran, ein Handbuch addEventListener als Workaround hinzuzufügen.