今天在學習React的es6語法的時候，發現了個有趣的現象，就是this的指向問題。es6的this不同於es5，它在創立函數伊始便已經存在了，而不是像es5一樣，睡調用的函數，this指向誰。但是這也產生了一個令人頭疼的問題，當改變狀態this.setState的時候，明顯會報錯，這是this指針的原因，那如何解決呢？只需要通過在調用函數的時候綁定this或者穿個e獲取即可，即：
<button onClick={this.openSwitch.bind(this)}> please click me</button>
或者
<button onClick={onClick={e => this.openSwitch(e)}}> please click me</button>
那我們如果想傳遞參數呢？只需要在bind里面的參數繼續添加即可，再在定義的事件里面進行接收即可，完全代碼如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>事件</title>
<script src="./bower_components/react/react.production.min.js"></script>
<script src="bower_components/react/react-dom.production.min.js"></script>
<script src="bower_components/babel/browser.js"></script>
</head>
<body>
<div id="test2"></div>
</body>
<script type="text/babel">
class Btn2 extends React.Component {
openSwitch(status){
console.log(status);
console.log(this);
}
render() {
return (
<button onClick={this.openSwitch.bind(this,123)}> please click me</button>
)
}
}
ReactDOM.render(
<Btn2/>,
document.getElementById("test2")
)
</script>
</html>
結果如下：
如果想得到event的話，只需要在形參的后面加上event即可