React事件 改變this指向

1.普通函式 寫成箭頭函式

普通函式列印出來是undefined

import react from

'react'
import reactdom from
'react-dom'
import
'./index.css'
class
header
extends
react.component
;btnclick()
render()
>普通函式<
/h1>
<
/div>}}
reactdom.
render
(<
/header>
, document.
getelementbyid
('root'))
;

es6箭頭函式沒出現之前，this的指向不是函式被建立時繫結，而是被怎麼樣的方式呼叫時繫結的。而箭頭函式剛好相反，箭頭函式的this指向是函式被建立時繫結的，它的指向就是該函式所在的作用域指向的this，並且不會因為被怎麼樣的方式呼叫改變繫結，沒有上下文物件，this就指向window。

import react from

'react'
import reactdom from
'react-dom'
import
'./index.css'
class
header
extends
react.component
;btnclick()
render()
}>箭頭函式<
/h1>
<
/div>}}
reactdom.
render
(<
/header>
, document.
getelementbyid
('root'))
;

import react from

'react'
import reactdom from
'react-dom'
import
'./index.css'
class
header
extends
react.component
;btnclick=(
)=>
render()
>普通函式<
/h1>
<
/div>}}
reactdom.
render
(<
/header>
, document.
getelementbyid
('root'))
;

import react from

'react'
import reactdom from
'react-dom'
import
'./index.css'
class
header
extends
react.component
;btnclick()
render()
>bing 改變this指向<
/h1>
<
/div>}}
reactdom.
render
(<
/header>
, document.
getelementbyid
('root'))
;

react 改變this指向

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

React基礎語法05 改變this指向的3種方法

使用this指向當前元件的三種方法 分別是在模板裡，在建構函式裡，在建構函式裡改變，推薦第三種，箭頭函式。定義的資料 this.state 方法 getdata 模板 第一種獲取資料的方法定義資料，建構函式 constructor 第二種改變this指向的方法 this.getmsg this.ge...

this指向 改變this指向

常見的this指向 常見的this指向 全域性下的this指向window 函式中的this，誰呼叫指向誰 建構函式中的this指向建構函式的物件 物件中的this預設指向當前物件 事件處理函式中this誰觸發指向誰 指向觸發事件的目標元素 定時器函式，this 指向 window 箭頭函式中沒有t...