綁定不是特定的反應(yīng),而是如何反應(yīng)。this
在Javascript工作。每個(gè)函數(shù)/塊都有它自己的上下文,對于函數(shù)來說,它更具體的是如何調(diào)用它。反應(yīng)小組決定this
不綁定類上的自定義方法(也不是類的內(nèi)置方法,如componentDidMount
)時(shí),添加ES6支持(類語法)。
當(dāng)您應(yīng)該綁定上下文時(shí),取決于函數(shù)的用途,如果您需要訪問類中的道具、狀態(tài)或其他成員,則需要綁定它。
對于您的示例,每一個(gè)都是不同的,這取決于您的組件是如何設(shè)置的。
第一. .bind(this)
用于將此上下文綁定到組件函數(shù)。如果您不想綁定該函數(shù)的每次使用(如在單擊處理程序中),則可以通過以下任一方法預(yù)綁定該函數(shù)。
在構(gòu)造函數(shù)中做綁定。阿卡
class SomeClass extends Component{
constructor(){
super();
this.someEventHandler = this.someEventHandler.bind(this);
}
someEventHandler(event){
}
....}
或者B.使您的自定義函數(shù)在類FAT箭頭函數(shù)上。阿卡
class SomeClass extends Component{
someEventHandler = (event) => {
}
....}
所有這些都涉及到這個(gè)上下文綁定。
第二. onChange={(event) => { this.someEventHandler(event) }
是用內(nèi)聯(lián)lambda(FAT箭頭)函數(shù)包裝組件處理程序函數(shù),該函數(shù)可以提供一些附加功能。假設(shè)您想要向您的函數(shù)發(fā)送額外的Param,這是實(shí)現(xiàn)該功能的一種方法。
<input onChange={(event) => { this.someEventHandler(event, 'username') }>
如果需要,這將是向處理程序函數(shù)傳遞附加參數(shù)的一種方法。
第三..您只是將函數(shù)作為回調(diào)函數(shù)傳遞,以便在發(fā)生單擊事件時(shí)觸發(fā),而不需要附加參數(shù)。
總結(jié)一下。這三個(gè)示例都與將處理程序函數(shù)傳遞給單擊事件有關(guān)。然而,有不同的東西,你可以添加到這一點(diǎn)。第一個(gè)是關(guān)于你的this
背景。第二個(gè)問題是如何將參數(shù)傳遞給處理程序函數(shù)。