Parameter dalam Fungsi JSX
Misalkan fungsi kita showMess menerima parameter
nama orang yang ingin kita sapa:
function showMess(name) {
alert('hello, ' + name);
}
Kita dapat meneruskan parameter ini saat mengikat fungsi ke event. Untuk melakukannya, panggilan fungsi kita harus dibungkus dalam fungsi panah (arrow function):
function App() {
function showMess(name) {
alert('hello, ' + name);
}
return <div>
<button onClick={() => showMess('user')}>show</button>
</div>;
}
Dengan demikian kita dapat mengikat satu fungsi yang sama ke beberapa tombol dengan parameter yang berbeda:
function App() {
function showMess(text) {
alert(text);
}
return <div>
<button onClick={() => showMess('user1')}>show1</button>
<button onClick={() => showMess('user2')}>show2</button>
</div>;
}
Diberikan tiga tombol:
function App() {
return <div>
<button>act1</button>
<button>act2</button>
<button>act3</button>
</div>;
}
Buatlah agar saat mengklik tombol pertama
melalui alert menampilkan angka 1, saat mengklik
tombol kedua - angka 2, dan saat mengklik
tombol ketiga - angka 3.