react是Spa嗎

這篇文章主要介紹“react是Spa嗎”的相關知識，小編通過實際案例向大家展示操作過程，操作方法簡單快捷，實用性強，希望這篇“react是Spa嗎”文章能幫助大家解決問題。

react是Spa模式，即組件嵌套，其主要的傳參方式有：1、在掛載的地方給組件傳參；2、父子傳參，即用props或ref方式傳參；3、子父傳參，即子組件通過觸發父組件的方法來改變父組件的狀態；4、兄弟傳參，即通過改變公有組件的狀態進而改變子組件的狀態；5、遠親間的傳參，即通過redux協助傳參。

react是不是Spa？

react是一個SPA模式，即組件嵌套，在一個單頁面的應用中組件間的數值傳遞是必不可少的，主要的傳參方式大致有一下幾種：

1、在掛載的地方給組件傳參

　　ReactDOM.rander(<a name='a' age={16}/>,app) 在渲染的時候，直接給掛載的組件傳參。

2、父子傳參

　　父子傳參可以用props和ref兩種方式，①，props方式傳參，父組件通過改變自己的參數并且通過props將狀態傳遞給子組件，并在子組件中顯示。②，通過ref傳參，這種方式是通過子組件自己的方法改變自己的狀態后，父組件通過觸發子組件的方法更改參數。

3、子父傳參

　　子組件通過觸發父組件的方法來改變父組件的狀態，

4、兄弟傳參

　　兄弟傳參有兩種，一種是通過狀態提升，通過改變公有組件的狀態進而改變子組件的狀態，另一種是通過ref傳參的方式，改變原有的狀態。

5、遠親間的傳參

　　通過redux協助傳參，一般會適用與項目間的交互較多時使用，并沒有什么互動時若使用redux反而會增加項目的復雜度，當不知道要不要使用redux的時候就不要使用。

相關介紹：

單頁Web應用（single page web application，SPA），就是只有一張Web頁面的應用，是加載單個HTML 頁面并在用戶與應用程序交互時動態更新該頁面的Web應用程序。

—— 《百度百科》

SPA 的概念早已有之，簡單說來就是：不管你這個網站有多少頁面，我都給你整到一個頁面里去。

SPA不做頁面刷新，只做局部更新，也就是除了你第一次打開網站的時候需要加載整個頁面之外，之后的一切站內跳轉都是不重載頁面的，而是在當前頁面進行局部刷新，達到頁面切換的效果。

想象一下，假設網站原本需要兩個頁面a和b，但現在我只做一個index，然后把a和b兩個頁面的所有html片段都寫到index里去，顯示的時候，通過js來判斷當前的url，如果是/a，我就只顯示原本屬于a的html片段；同理，如果是/b，我就顯示b的html片段。

關于“react是Spa嗎”的內容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業相關的知識，可以關注億速云行業資訊頻道，小編每天都會為大家更新不同的知識點。