react中解決this指向問題的四種方法

2021-09-11 20:30:58 字數 727 閱讀 1198

相信大家在學習和使用react的過程中,稍不注意就會出現this指向錯誤的問題,這個問題雖然比較好解決,但是還是讓人比較頭疼,那麼下面就說一下解決這個問題的四種寫法。

一.行間定義事件後面使用bind繫結this

run()

第一種

這一種方法使用bind來修改this的指向,需要注意的是bind括號內第乙個引數是修改this的,後面可以設定其他引數進行傳值。

二.在建構函式內部宣告this指向

constructor(props) 

this.run = this.run.bind(this); }

run()

第二種

第二種方法和第一種方法原理一樣,只是寫的位置不同。

三.宣告事件時將事件等於乙個箭頭函式

run=()=> 

第三種

第三種方法是將定義的run方法再等於乙個箭頭函式,利用箭頭函式沒有自己的this指標會繼承外層的作用域這個特性,來解決this指向問題

四.行間定義事件使用箭頭函式

run()

this.run()>第四種

第四種方法和第三種方法的原理是一樣的,只是寫法不同,全憑個人喜好吧。

react中this指向問題

一.行間定義事件後面使用bind繫結thisrun 第一種 這一種方法使用bind來修改this的指向,需要注意的是bind括號內第乙個引數是修改this的,後面可以設定其他引數進行傳值。二.在建構函式內部宣告this指向constructor props this.run this.run.bin...

react 改變this指向

1.行間定義事件後面使用bind繫結this 使用bind來修改this的指向,需要注意的是bind括號內第乙個引數是修改this的,後面可以設定其他引數進行傳值。如下 run this.run.bind this 第一種 2.在建構函式內部宣告this指向 第二種方法和第一種方法原理一樣,只是寫的...

react中解決this指向問題的四種方法

一 行間定義事件後面使用bind繫結this run 第一種 button 這一種方法使用bind來修改this的指向,需要注意的是bind括號內第乙個引數是修改this的,後面可以設定其他引數進行傳值。二 在建構函式內部宣告this指向 constructor props this run thi...