84669 人學習
152542 人學習
20005 人學習
5487 人學習
7821 人學習
359900 人學習
3350 人學習
180660 人學習
48569 人學習
18603 人學習
40936 人學習
1549 人學習
1183 人學習
32909 人學習
<button onClick={this.handleEvent}> //这里的this是toggle组件 为什么还需要在组件里绑定这个函数的this {this.state.isToggleOn === true ? 'on' : 'off'} </button>
想不明白這裡的this綁定
光阴似箭催人老，日月如移越少年。
因為在class中宣告函數，並不會自動綁定this物件
class
this
所以，你在onClick={this.handleEvent}的時候，分解成兩步你就懂了：
onClick={this.handleEvent}
let handleEvent = this.handleEvent; ...onClick={handleEvent}...
所以，onClick調用的時候，handleEvent中的this會是undefined（根據文檔）
onClick
handleEvent
undefined
所以，你需要bind一下, 那麼裡面的this就是當前組件啦。
bind
還有一個方便的寫法，就是用箭頭函數宣告：
handleEvent = (e)=>{ } render(){ ...onClick={this.handleEvent}... }
因為handleEvent中this.setState...的this並沒有綁定this
可以採用箭頭函數的語法糖來綁定this
handleEvent = () => { this.setState... }
因為在
class中宣告函數，並不會自動綁定this物件所以，你在
onClick={this.handleEvent}的時候，分解成兩步你就懂了：所以，
onClick調用的時候，handleEvent中的this會是undefined（根據文檔）所以，你需要
bind一下, 那麼裡面的this就是當前組件啦。還有一個方便的寫法，就是用箭頭函數宣告：
因為handleEvent中this.setState...
的this並沒有綁定this
可以採用箭頭函數的語法糖來綁定this