【React學(xué)習(xí)】—React中的事件綁定(八)
一、原生JS
<body>
<button id="btn1">按鈕1</button>
<button id="btn2">按鈕2</button>
<button onclick="demo()">按鈕3</button>
<script>
const btn1 = document.getElementById("btn1");
btn1.addEventListener("click", () => {
alert("按鈕1被點(diǎn)擊了");
});
const btn2 = document.getElementById("btn2");
btn2.onclick = () => {
alert("按鈕2被點(diǎn)擊了");
};
function demo() {
alert("按鈕3被點(diǎn)擊了");
}
</script>
</body>
文章來源:http://www.zghlxwxcb.cn/news/detail-690589.html
二、React中的事件綁定
<script type="text/babel">
class Weather extends React.Component {
constructor(props) {
super(props);
this.state = { isHot: false };
}
render() {
return (
<h1 onClick={demo}>
今天天氣很{this.state.isHot ? "炎熱" : "涼爽"}
</h1>
);
}
}
ReactDOM.render(<Weather />, document.getElementById("test"));
function demo() {
console.log("標(biāo)題被點(diǎn)擊了");
}
</script>
文章來源地址http://www.zghlxwxcb.cn/news/detail-690589.html
到了這里,關(guān)于【React學(xué)習(xí)】—React中的事件綁定(八)的文章就介紹完了。如果您還想了解更多內(nèi)容,請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!