React之jsx語法特性

2021-09-07 19:15:03 字數 754 閱讀 6014

jsx 語法,直接可以在js中使用html標籤。

還可以通過花括號的形式,在html標籤中,寫js表示式。

hello,world!

事件是大寫

add
react中的程式設計思想是,面向資料程式設計。只要定義資料就ok了,資料變了,頁面展示的內容就會變了。

react刪除不需要操作dom,只需要運算元據就可以了。將對應的資料從刪除,自動就會移除dom。只要找到對應的下標就可以了。

元件拆分。大元件,可以引用小組件。元件之間可以傳遞資料。

return
父子元件,父元件通過屬性的形式向子元件傳遞引數。

子元件通過props接受父元件傳遞過來的引數。

子元件,向父元件傳值,要呼叫父元件傳遞過來的方法。

針對知識點,以點帶面,開啟知識盲區。

constructor(props)
jsx中使用css,物件方式處理樣式。

classname替代之前的class屬性來處理class。

需要在index.js入口檔案中,引入css檔案。

外層包裹標籤,替代div標籤。

優化**,讓它優雅。

官網學習,讀官方文件,建議閱讀英文文件。

關於React之JSX語法理解

理解 j ascript和html的結合,碰到 就按照html來解析,碰到 就按照js來解析。也可以理解為可以在js 書寫html標籤,每個標籤最終都會轉化為js 來執行。他的語法規則大致如下 1 必須有根元素,即最外層有且只有乙個標籤 2 所有的標籤必須閉合 3 對大小寫敏感,區分是元件還是htm...

ReactJS入門之JSX語法

jsx語法就是,可以在js檔案中插入html片段,是react自創的一種語法。jsx語法會被babel等轉碼工具進行轉碼,得到正常的js 再執行。使用jsx語法,需要2點注意 1.所有的html標籤必須是閉合的,如 hello world,寫成這樣是不可以的 2.在jsx語法中,只能有乙個根標籤,不...

用於react 中的JSX語法配置方法

什麼是jsx語法 就是符合 xml 規範的 js 語法 語法格式相對來說,要比html嚴謹很多 1.如何啟用 jsx 語法?安裝能夠識別轉換jsx語法的包,就是將jsx轉化為js babel preset react 新增.babelrc配置檔案 新增babel loader配置項 module j...