Wie reagiere hot-loader arbeiten für jsx?

Question

Ich habe gerade mit reactjs begonnen und versucht, heiß nachladen für meine jsx gehen. Ich gabelte diese App: https://github.com/gaearon/react-hot-boilerplate/tree/next.

änderte ich die app.js leicht zu:

import React, { Component } from 'react'; 

export default class App extends Component { 
    constructor(){ 
     super(); 
     this.state = { 
     txt: 'this is the txt', 
     cat: 0 
     } 
    } 

    render() { 
    return (<div> 
      {this.state.txt} 
     <h1>sdfdsfdsfs, world.</h1> 
     </div> 

    ); 
    } 
} 

Wenn ich den Text innerhalb des h1-Tag ändern ist erfrischt den Browser. Wenn ich jedoch die txt-Eigenschaft ändere, passiert nichts. Wie kann ich das funktionieren lassen?

Answer 1

React-hot-loader kann Änderungen im Ausgangszustand im Konstruktor nicht erneut laden. Dies liegt daran, dass der Konstruktor für die Komponente nicht erneut von react-hot-loader aufgerufen wird, wenn sich etwas in der Komponente ändert.

Es kann nicht heiß Änderungen in den Ausgangszustand neu laden. Vergessen Sie nicht, dass diese Eigenschaftszuweisung dem Setzen des Felds innerhalb des Konstruktors entspricht. Auch wenn Sie den Konstruktor ändern, wurde das Feld bereits festgelegt. Konstruktor wird nicht zweimal ausgeführt. Dies wird nicht unterstützt.

Schauen Sie sich dieses Problem: https://github.com/gaearon/react-transform-hmr/issues/41