react元件傳參

2021-10-03 03:32:56 字數 1217 閱讀 3135

父元件向子元件傳參

父傳子通過(props)屬性向子元件的attr中傳值

父元件 parent.js

import react,

from

"react"

;import child from

"../child"

;export

default

class

parent

extends

component;}

render()

/>

<

/div>);

}}

子元件child.js

import react,

from

"react"

;export

default

class

child

extends

component

=this

.props;

return

父元件傳來的引數

<

/div>;}

}

子傳父

子元件向父元件傳參,需要通過事件進行觸發,子元件呼叫父元件的方法並把值傳遞給父元件

parent.js

import react,

from

"react"

;import child from

"../child"

;export

default

class

parent

extends

component;}

add= name =>);

};render()

/>

<

/div>);

}}

child.js

import react,

from

"react"

;export

default

class

child

extends

component;}

componentdidmount()

render()

}

非相關元件傳參

非元件傳值(子傳給父,父再傳給另乙個子)

React元件傳參

1.基礎傳參 父元件 1.傳遞資料 2.傳遞方法 setage v this.sestate setage 子元件 獲取資料 2.2.context上下文傳遞引數 特點 引入的context資料是實時更新的,當乙個資料發生改變,所有引用的檢視都會自動更新。父元件 1.匯入型別檢測 import pr...

react 元件傳參

父元件 render111 return 有狀態元件接受引數 render 我內部的資料 無狀態元件接受引數 import react from react function nostatecomponent props cjs esm export default nostatecomponent...

react父子元件傳參

父子元件通訊主要用到props,如下 在父元件中 import react from react import childcom from childcom.js class parentcom extends react.component export default parentcom 複製 ...