react學習第二天(三)

2021-10-08 16:24:51 字數 1369 閱讀 2493

react元件:函式式元件、類元件

1、函式式元件

//函式式元件

function

father()

reactdom.

render

(>

, document.

queryselector

('#root'

))

//函式式元件

function

father()

<

/p>

是否出門?<

/p>

<

/span>

<

/div>)}

reactdom.

render

(>

, document.

queryselector

('#root'

))

效果如下:

2、類元件

//類元件

class

helloworld

extends

react.component

}reactdom.

render

(>

, document.

queryselector

('#root'

))

效果如下:

3、元件傳參

function

father

(props)

<

/div>

是否出門?<

/p>

<

/span>

<

/div>)}

reactdom.

render

("下雨"

/>

, document.

queryselector

('#root'

))

conso le.log(props)控制台 輸出:

4、元件中可以巢狀元件,稱 為復合元件,復合元件中既可以有類元件又可以有函式式元件

class

helloworld

extends

react.component

}

5、函式式元件與類元件區別:

react學習第二天(二)

jsx style 樣式 let examplestyle let element helloworld h1 jsx中不能在style中直接新增樣式 div reactdom.render element,document.queryselector root let color bgpink l...

react學習第二天(一)

1 react jsx語法優點 2 react jsx語法注意 3 jsx表示式 例一 let str 當前的時間是 let time newdate tolocaletimestring let element h1 h2 表示式 div reactdom.render element,docum...

學習第二天

linux系統的檔案型別及許可權的相關知識 1.普通檔案 l 連線檔案 d 資料夾 表示不同的檔案型別 2.檔案許可權 r 可讀 w 可寫 x 可執行 3.chmod 修改檔案許可權,修符號或者使用八進位制 linux的基礎命令 cd 切換目錄 ls 檢視內容 表示當前目錄 上一級目錄等 touch...