Vedi il mio esempio codepen qui: link
Assicurati di aprire la console.
Nell'esempio possiamo vedere che possiamo cambiare state.testObj.foo usando setState su un pulsante, o mutare lo stato direttamente sul secondo pulsante.
Se lo facciamo nel primo modo - aggiornerà il DOM, mentre il secondo modo non aggiornerà il DOM - ma l'evento intervallo che ho impostato verrà aggiornato.
C'è una ragione per non farlo?
Il motivo per cui voglio farlo è che ho un componente di reazione della tela, che usa refs per dipingere l'elemento canvas e anima tutto con requestDrawingFrame . Voglio avere qualche modo di comunicare con il suo contenitore genitore. Per fare questo uso un oggetto 'core'.
vale a dire:
class MyComponent extends React.Component {
...
render() {
return <div>
<MyCanvas core={this.canvasCore}/>
</div>;
}
}
Posso poi fare cose come:
this.canvasCore.addPaintable(...);
this.canvasCore.getImage();
ecc.
Se lo faccio dovrei usare setState ogni volta che aggiungo nuovi oggetti alla mia tela (più volte al secondo), e mi sto chiedendo il sovraccarico delle prestazioni.