javascript - 關於react裡的一個疑問
PHP中文网
PHP中文网 2017-06-15 09:23:44
0
2
690

下面是一段react寫的簡單動態效果,但有分地方不清楚。在定時器裡的結尾為什麼要加bind(this),它的作用是什麼,我缺了那一塊的知識點導致我不清楚要加bind(this)的?

var Hello = React.createClass({ getInitialState: function () { return { opacity: 1.0 }; }, componentDidMount: function () { this.timer = setInterval(function () { var opacity = this.state.opacity; opacity -= .05; if (opacity < 0.1) { opacity = 1.0; } this.setState({ opacity: opacity }); }.bind(this), 100); }, render: function () { return ( 

Hello {this.props.name}

); } }); ReactDOM.render( , document.body );
PHP中文网
PHP中文网

认证高级PHP讲师

全部回覆 (2)
大家讲道理

兩個知識點:

  • bind()

  • this 指向

具體到這個例子,如果不使用bind()而直接呼叫 setInterval 中定義的匿名函數,函數內部的 this 是指向 window 物件的。匿名函數內部顯然需要 this 指向目前元件,才能讀取state屬性/呼叫setState()方法,所以使用bind()為匿名函數綁定目前執行環境的 this,即目前元件。

    phpcn_u1582

    你只要分辨下面幾個this就知道了。

    1.bind(this)這個this指的是什麼。
    2.不bind(this)時,回呼執行時,函數裡的this指的是什麼。
    3.bind(this)之後,回呼執行時,函數裡的this指的是什麼。

      最新下載
      更多>
      網站特效
      網站源碼
      網站素材
      前端模板
      關於我們 免責聲明 Sitemap
      PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!