null dereferenzieren in React 15.1 auf dem Bild Last

Question

ich in einen fremden Fehler laufe nach dem Update 15.1 reagiert von reagieren 0,14:

ReactDOMComponentTree.js:105 Uncaught TypeError: Cannot read property '__reactInternalInstance$wzdyscjjtuxtcehaa6ep6tj4i' of null

Es scheint, dass ein „load“ -Ereignis von einem Bild in der Seite begraben die Verwendung einer Daten-URL verursacht ein Ereignis und reagiert auf das DOM. Wenn es das oberste Element react injected trifft, hat es kein parentElement und versucht dann auf ein Member auf dem "null" parentElement zuzugreifen

Vereinfachte Anwendung (gekürzt):

class App extends React.Component {  
    render() { 
    return <div id="rootcomponent"> 
     ... 
    </div>; 
    } 
} 

ReactDOM.render(<App/>, document.getElementById('app')); 

resultierender HTML:

<div id="app"> 
    <div id="rootcomponent"> 
    ... 
    </div> 
</div> 

Das Element mit der ID "RootElement" hat ein Null-parent, die den Fehler verursacht. Die Seite scheint ansonsten zu funktionieren, was für mich verwirrend ist.

Stacktrace:

getClosestInstanceFromNode (ReactDOMComponentTree.js:105) 
findParent (ReactEventListener.js:39) 
handleTopLevelImpl (ReactEventListener.js:68) 
Mixin.perform (Transaction.js:136) 
ReactDefaultBatchingStrategy.batchedUpdates (ReactDefaultBat…Strategy.js:63) 
batchedUpdates (ReactUpdates.js:98) 
ReactEventListener.dispatchEvent (ReactEventListener.js:150) 

Gedanken über diese Korrektur? Vielleicht ein Reaktionsbug?

Answer 1

Ich bin ein Derp.

Ich bemerkte gerade, dass mein Javascript zweimal geladen wurde. Ich hatte auch das HtmlWebpackPlugin über eine Hauptversion aktualisiert und es änderte etwas Verhalten, das das Injizieren des Javascript miteinbezog. So war es in meiner Vorlage und das Plugin hat es auch injiziert.

Nach dem Entfernen der Zeile aus der Vorlage, so dass das JavaScript einmal geladen wird, ist alles in Ordnung.

Das ist, was ich für das Aktualisieren von Bibliotheken um 17 Uhr bekomme.

Answer 2

Ist es nicht nur ein Tippfehler? Fehlende Klammer um neu gestimmten JSX-Inhalt.

class App extends React.Component {  
    render() { 
    return (<div id="rootcomponent"> 
     ... 
    </div>); 
    } 
} 

Answer 3

@Thomas Er hat Recht. In meinem Fall befülle ich manuell vendor.js in index.html und in der Zwischenzeit konfiguriere ich webpack, um HtmlWebpackPlugin zu verwenden, um emissified vendor.js auch zu spritzen.

Offensichtlich lädt es vendor.js zweimal und wirft den gleichen Fehler aus.