React初探之React特性

2022-02-26 20:08:41 字數 835 閱讀 8096

一、宣告式開發

與原生dom、jquery等命令式程式設計不同

不通過指令來控制檢視變化,是面向資料的程式設計

通過控制資料,改動資料的方式控制檢視的變化,dom的部分react會幫你自動構建

二、可以與其他框架並存

`reactdom.render(, document.getelementbyid('root'));`

如上,react只控制index.html中id=root部分dom的渲染,其他部分不作控制

可被相容到其他框架中(只要其他框架不影響它)

三、元件化

每乙個reactjs檔案都是乙個元件,含檢視、邏輯操作、資料

元件可以被巢狀到其他元件之中

注意元件宣告需要首字母大寫,如``

四、單向資料流

子元件對於父元件傳遞過來的資料是【唯讀】的

子元件直接不可修改父元件中的資料,只能通過呼叫父元件傳遞過來的方法,來間接修改父元件的資料

形成了單向清晰的資料流

防止了當乙個父元件的變數被傳遞到多個子元件中時,一旦該變數被修改,所有傳遞到子元件的變數都會被修改的問題

這樣出現bug除錯會比較困難,因為不清楚到底是哪個子元件改的

把對父元件的bug除錯控制在父元件之中

五、檢視層框架

react框架只負責檢視層部分的實現,以及父子元件之間簡單的通訊

涉及到複雜的跨元件通訊,需要借助redux等資料層框架實現

這樣為搭建小專案提供了簡易性,為搭建大專案提供了靈活性

六、函式式程式設計

每個功能都是乙個小函式,函式大了還可以繼續拆分,維護起來比較容易

提高了**可讀性,為後續自動化測試提供了便利

React之jsx語法特性

jsx 語法,直接可以在js中使用html標籤。還可以通過花括號的形式,在html標籤中,寫js表示式。hello,world!事件是大寫 addreact中的程式設計思想是,面向資料程式設計。只要定義資料就ok了,資料變了,頁面展示的內容就會變了。react刪除不需要操作dom,只需要運算元據就可...

初探React之生命週期

參照官網教程學習後的總結 react的週期可分為三個階段 例項化 存在期 銷毀 清理期 這三個階段分別執行不同的任務。例項化是在react第一次生成真實的dom時的週期,之後進入存在期。存在期react元件時時刻刻監聽props 和 state的變化,當這兩個屬性發生變化時,元件重新render。清...

React初始系列教程 1 React初探

什麼是react?react是facebook公司開發的乙個前端框架,是目前三大前端框架之一 react,angular,vue 元件化開發web與傳統web開發專案,確實絲滑很多,它有三大特點 宣告式 你只需要專注於描述你的ui,react會幫你做底層更新 元件化 所有ui都抽象成元件,大大提高可...