【React Native】JavaScript 中 bind 方法

這個問題其實是一個 JavaScript 中的問題。JavaScript中jQury的bind方法爲選定元素添加事件處理程序，規定事件發生時運行的函數。
　
語法爲：

$(selector).bind(event,data,function)

也就是相對應的event事件發生時就會執行function函數。data是傳遞數據的可選參數。event和function必須指定明確。


　在React Native中bind方法的作用也是這樣，爲指定的事件添加相應的處理函數。就是將處理函數和指定的操作綁定在一起。操作觸發時函數執行。
　

　爲了更明確的體現這種事件綁定關係，做下面實際例子:

在點擊登錄按鈕時，彈出alert對話框，效果如下(只是按鈕點擊與彈窗，輸入框請忽略)。



實現上面效果時，需要用bind方法將點擊操作和彈窗綁定在一起。
代碼爲：

	   <TouchableOpacity
          style={styles.style_view_commit}
          onPress={this.show.bind(this,"XX")}
        >
          <Text style={{ color: '#fff' }}>
            登錄
          </Text>
        </TouchableOpacity>

而其中的show函數：

  show(text){
    alert('確認名字爲'+text+"?");
  }

這是正確的綁定，實現了點擊彈窗的效果。
而當不通過bind方法時，直接調用this.show 　 就是將代碼改爲如下(show方法不變)：

	 <TouchableOpacity
          style={styles.style_view_commit}
          onPress={this.show("XX")}
        >
          <Text style={{ color: '#fff' }}>
            登錄
          </Text>
        </TouchableOpacity>

此時的效果：





已經不可以直接點擊來彈窗了。但是發現ReLoad時會出現彈窗。
也就是說，沒有bind時組件加載時會執行該函數，但是點擊操作並不能使函數執行。

當onPress寫成this直接調用（this.show）時，只會在reload時調用一次，而後的點擊操作並不會彈出alert。因爲它就是在組件渲染加載時調用一次，並沒有將點擊操作和函數關聯，做不到根據點擊來執行show函數。通過bind就能解決，也就是說這裏的bind綁定，是將點擊事件這個操作和show函數聯繫在一起，當點擊按鈕操作時，就會執行這個函數。所以，bind函數就是建立操作和函數執行的這種聯繫。

####箭頭函數也能完成事件綁定 另外，上面的bind綁定操作和show函數可以直接通過箭頭函數完成。箭頭函數可以直接完成bind綁定(它會綁定當前scope的this引用)。可以參照ES6寫法--[React Native中文社區中ES5和ES6的比較--方法作爲回調部分](http://bbs.reactnative.cn/topic/15/react-react-native-%E7%9A%84es5-es6%E5%86%99%E6%B3%95%E5%AF%B9%E7%85%A7%E8%A1%A8/2)。 也就是將上面實現代碼寫成如下形式： ``` this.show("XX")} >

所以，bind將事件操作和函數處理建立聯繫，bind和箭頭函數都能完成這一綁定。