Reactのonclickに引数を渡したいっ!
2018年6月13日
普通に引数が無い場合は、
clicked() {
console.log('click!!');
}
render () {
<div>
<a onClick={clicked}>リンク</a>
</div>
}
これで、クリックした時にclickedが呼ばれるので問題なし。
これに普通に引数を渡すと、
render () {
<div>
<a onClick={clicked(100)}>リンク</a>
</div>
}
こんな感じに書いて動かしてみると、renderしたタイミングでいきなりclickedが呼ばれる。
(表示した時点でclickedが呼ばれる)
そこで、無名関数を使う。
render () {
<div>
<a onClick={() => clicked(100)}>リンク</a>
</div>
}
こうすればrenderしたタイミングではnullがreturnされるんで、何も起きずにクリックした時にclickedが呼ばれる。