2015-06-04 11 views
14
React.render(<MyComponent/>, mainNode, function() { 
    console.log('2'); 
}); 
console.log('1'); 

stampeQuando viene chiamato il callback React.render()?

2 
1 

Inoltre, uno scrollTop() nella richiamata non funziona. Funziona se lo chiamo dopo che return() ritorna.

React.render() sincrono?

Il DOM viene eseguito quando la funzione restituisce?

Quando viene chiamato il callback? Cosa dovrei fare nella callback?

+2

se è necessario eseguire il callback dopo la creazione del componente di reazione, è necessario inserire la funzione di callback all'interno della funzione componentDidMount del componente di reazione. –

+1

Voglio una richiamata dopo aver reagito ha aggiornato il DOM. Sto provando a fare un window.scrollTop(), ma in particolare sto cercando di capire meglio il ciclo di vita di reagire. Il DOM è disponibile su window.document quando viene chiamato componentDidMount? Inoltre, componentDidMount richiede chiamate successive a React.render()? – akula1001

+1

il DOM disponibile quando viene chiamato componentDidMount perché è possibile utilizzare React.findDOMNode (this.refs.node) in questa fase. React.render non è sincrono. Nel tuo esempio, React.render non ha alcuna richiesta al servizio perché la libreria React è già presente sul browser, quindi l'asincrono non avviene. –

risposta

13

È possibile spostare la logica di richiamata nel componente che si sta montando e quindi utilizzare il metodo componentDidMount per la prima volta che il componente viene reso al DOM e componentDidUpdate per gli aggiornamenti/rendering successivi al DOM. Il componente sarà disponibile nel DOM reale tramite window.document o utilizzando il metodo getDOMNode dei componenti in entrambi i metodi.

Questo non è esattamente come un richiamo di rendering di per sé. Vale la pena notare che se si modifica lo stato del componente è anche possibile passare una funzione di callback al metodo setState per il componente che verrà applicato una volta che lo stato dei componenti è stato aggiornato (e qualsiasi modifica apportata al DOM).

Dopo aver esaminato il codice sorgente React per confermare - quando si esegue il rendering di un nuovo nodo root (come per lo snippet di codice) nel DOM, il processo è sincrono e il callback (se passato) si attiva immediatamente dopo (https://github.com/facebook/react/blob/master/src/renderers/dom/client/ReactMount.js righe 570-582

Problemi correlati