【Under-the-hood-ReactJS-Part7】React源碼解讀

接上文，

React流程圖：
https://bogdan-lyashenko.gith...

回到最初

做爲掛載方法執行以後的輸出，咱們獲得了將用於插入DOM樹的HTML元素。可是事實上，標籤是生成了，可是mountComponenent--無論他叫什麼---不是真正的HTML標籤。它實際上是一種擁有字段children，node（真正的DOM節點）等的數據結構。當咱們將HTML元素插入到DOM中指定的容器時（在ReactDOM.render方法中指定的容器），React會將容器中插入位置以前的內容給刪除。DOMLazyTree是個工具類，用於執行一些樹數據結構的真正做用於DOM的相關操做。
在最好的過程當中，會執行parentNode.insertBefore(tree.node)方法，其中，parentNode是插入的容器中div節點，而tree.node則是咱們真正的ExamleApplication對應的div節點。終於，在掛載過程當中被建立的HTML元素被插入到DOM文檔中。

其實，上面步驟不是所有，如前文所講，對掛載的調用是被包裝進了一個事務中。也就是說，咱們須要調用close方法來關閉這個事務。咱們看下close包裝器列表，大多數狀況下，咱們須要恢復一些鎖定的行爲，好比ReactInputSelection.restoreSelection(),ReactBrowserEventEmitter.setEnabled(previouslyEabled),同時，也須要經過this.reactMountReady.notifyAll來通知執行全部以前放入transaction.reactMountReady隊列裏的回調。其中之一就是componentDidMount方法，這個方法會在close包裝器裏被觸發。
如今，你應該對component did mount的含義有個比較清楚的認識了。

更多有關關閉事務

在掛載過程當中，使用的事務不止上文的那一個，還有一個咱們以前用來包裝ReactMount.atchedMountComponentIntoNode的調用。這個是須要關閉。

咱們檢查下ReactUpdates.flushBatchedUpdates的包裝器，它是用來處理dirtyComponents的。咱們剛剛完成了咱們的第一次掛載，這時候是沒有dirtycomponents的，也就是說，在此次掛載中，它是一個空調用。因此，咱們能夠關閉此次事務，而且能夠說，批量更新策略已經完成了。
（未完待續）