react的詳細知識講解!

千鋒武漢發表於2021-05-26

react是一個用於構建使用者介面的JavaScript庫檔案,react可以使構建互動UI的過程變得簡單。對於你的應用裡面的每個狀態檢視,當資料變化的時候,react都會及時並且正確有效率地進行對其更新,這種陳述式檢視,將使你的程式碼更有可控性,並且更加易於除錯。web前端學習都會涉及react,今天小千就來給大家詳細的講述一下react的知識。

react有六大特點:宣告式設計——採用宣告正規化,可以輕鬆描述應用;高效——React透過對DOM的模擬,最大限度地減少與DOM的互動;靈活——React可以與已知的庫或框架很好地配合;JSX——JSX 是JavaScript語法的擴充套件;元件——透過React構建元件,使得程式碼更加容易得到複用;單向響應的資料流——React 實現了單向響應的資料流,從而減少了重複程式碼。

react的詳細知識講解!

由於react是一個JavaScript庫,所以掌握它的前提就是:你已經有了相關JavaScript的基礎理解能力,你瞭解HTML和CSS。而這些也是一個專業的web應用安全培訓機構在設定課程時需要注意的一點。


接下來我們來了解react的生命週期、資料流及事件。


在元件的整個生命週期中,隨著該元件的props或者state發生改變,它的DOM表現也將有相應的變化,一個元件就是一個狀態機:對於特定的輸入,它總會返回一致的輸出。 React為每個元件提供了生命週期鉤子函式去響應不同的時刻,元件的生命週期分為三個部分:(1)例項化;(2)存在期;(3)銷燬&清理期。


在react中,資料流向是單向的——從父節點傳遞到子節點,因而元件是簡單且易於把握的,他們只需從父節點獲取props渲染即可。如果頂層元件的某個prop改變了,react會遞迴地向下遍歷整棵組建樹,重新渲染所有使用這個屬性的元件。react元件內部還具有自己的狀態,這些狀態只能在元件內修改。


react透過將時間處理器繫結到元件上來處理事件。在事件被觸發的同時,更新元件的內部狀態。元件內部狀態的更新會觸發元件重繪。因此,如果檢視層想要渲染出時間觸發後的結果,它所需要做的就是在渲染函式中讀取元件的內部狀態。


如果你想了解更多關於react的知識,你可以關注我,後期分享更多前端技術知識!


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/31548651/viewspace-2773992/,如需轉載,請註明出處,否則將追究法律責任。

相關文章