react非同步載入的方法很多，這裡只說一種，因為這一種直接使用react的特性就可以了，不需要另外配置webpack，就是用乙個小技巧去import元件，所以方便，實現簡單。
寫乙個元件a，這個元件內部會載入另外的元件b，用b的內容完全覆蓋到a上面，
路由需要開啟a的時候，內容載入的b才會調起，達到非同步效果，而b就是我們真正想開啟的元件，
文章最後給返回元件a的**。
直接看上面截圖，asynccomponent是乙個函式，呼叫它會返回元件a，a內部載入我們想要的元件b，asynccomponent算是乙個工廠函式，可以返回元件a，構造元件a需要傳進去乙個函式，這個函式直接返回我們想要的元件b。
asynccomponent會用拿到的元件b來渲染元件a，所以雖然開啟的是元件a，但元件a本身是空的，把元件b完全融合進去之後，其實a就變成跟b一樣了，
這算是一種mixin技術。
**中其中乙個紅框圈出來的asyncstart，就是asynccomponent返回的元件，構造時傳給它的函式返回的就是我們想要import的元件start，asynccomponent函式內部把start融入asyncstart後再返回，這樣，我們得到跟start一樣的另乙個元件。
再看看路由，像普通元件那樣引用 asyncstart就行，最後構建的結果是多個js檔案（左邊檔案列表圈出），用瀏覽器開啟頁面後可以看引用的原始檔，每次開啟乙個新頁面，才引入乙個新的js，確實是非同步按需載入的，如下圖：
下面給出asynccomponent元件的**：
import react,
from
'react'
;const
asynccomponent
=(importcomponent)
=>
componentdidmount()
);//把元件b存起來})
;}render()
/>
:null
;//返回的其實就是元件b，並且把傳給a的屬性也轉移到b上}}
};export
default asynccomponent;
react之元件非同步載入
我們在用react的時候，希望元件非同步載入，提高效能，那麼應該怎麼實現呢？往下看。react非同步載入的方法很多，這裡只說一種，因為這一種直接使用react的特性就可以了，不需要另外配置webpack，就是用乙個小技巧去import元件，所以方便，實現簡單。寫乙個元件a，這個元件內部會載入另外的元...
開發隨筆 React非同步載入元件封裝
react非同步載入元件封裝 作者正在開源乙個基於react typescript node.js的部落格系統，原始碼在練手開源專案，有想一起學習的或者有空的大佬可以幫我看看 提提意見，順便給個star最好不過拉。謝謝大家 1.場景敘述 今天，碰到這樣乙個問題，就是當表單過載修改的時候，需要根據介面...
react 專案對元件進行模組化載入
開發 react 單頁面應用專案的過程中，如果不進行按需載入及打包，往往js檔案會很大，之前專案的js檔案達到7兆，頁面的載入過程變的很慢，使用者的體驗變的非常不友好，所有就蒐集了進行按需載入的方法，現在進行下總結及記錄，方便以後的覆盤使用 1.新建乙個 asynccomponent.js 檔案 i...