React中繫結this並傳參的三種方式

2021-10-02 15:54:48 字數 893 閱讀 4264

react中,在使用函式的過程中可能會改變this的指向,導致不能正常獲取到值的問題,所以react中有三種方式可以供我們使用,從而解決this的指向問題。

bind的作用:為前面的函式,修改函式內部的this指向,讓函式內部的this,指向bind引數列表中的第乙個引數。bind中的第乙個引數,是用來修改this指向的,第乙個引數後面的所有引數,都會當做將來呼叫前面函式時候的引數傳遞進去。

函式呼叫:

changemsg(arg1,arg2) )

}

constructor中使用bind改變函式指向:

this.changemsg = this.changemsg.bind(this,'☺','☼')
注意:當為乙個函式,呼叫bind改變了this指向後,bind函式呼叫的結果,有乙個返回值,這個值,就是被改變this指向後的函式的引用,bind不會修改原函式的this指向,所以需要重新賦值。

函式呼叫:

changemsg(arg1,arg2) )

}

} />
函式呼叫:

changemsg(arg1,arg2) )

}

React中this值繫結和事件函式傳參

react中也有this值的繫結問題,接下來將介紹五種繫結模式。如果你使用react.createclass來建立元件,那麼react會自動把函式中的this值指向元件例項。react.createclass handlechange function event render function v...

js 防抖傳參並繫結this

網上有不少防抖 是內含傳參功能的,但是沒有具體的傳參使用例項,希望我的案例能幫到大家。將this繫結到input上,並傳遞引數 input.onkeyup debounce show,1000 bind input,hello world function show arg1,arg2 functi...

react 路由傳參

今天,我們要討論的是react router中link傳值的三種表現形式。分別為通過萬用字元傳參 query傳參和state傳參。ps 進入正題前,先說明一下,以下的所有內容都是在react router v4的版本下。1.params route定義方式 link元件 html方式 萬用字元 js...